জাভাস্ক্রিপ্ট ব্যাসিক (JS Basic Tutorial)

Web Development - জাভাস্ক্রিপ্ট (JavaScript) - NCTB BOOK

Please, contribute to add content into জাভাস্ক্রিপ্ট ব্যাসিক (JS Basic Tutorial).

Content

জাভাস্ক্রিপ্ট কি এবং কেন শিখবেন? (What is JS & why learn?)

জাভাস্ক্রিপ্ট কি?

জাভাস্ক্রিপ্ট(Javascript) হচ্ছে ওয়েব এবং এইচটিএমএল-এর জন্য প্রোগ্রামিং ভাষা।

প্রোগ্রামিংয়ের সাহায্যে আপনি কম্পিউটারকে দিয়ে যা করাতে চান তাই করাতে পারবেন।

জাভাস্ক্রিপ্ট শেখাও অনেক সহজ।

আমাদের এই জাভাস্ক্রিপ্ট টিউটোরিয়ালটি আপনাকে জাভাস্ক্রিপ্টের মৌলিক ধারণা থেকে অ্যাডভান্স লেভেলের প্রোগ্রামার হতে সাহায্য করবে।

আমাদের প্রতিটি পরিচ্ছেদে আছে অসংখ্য উদাহরণ সেকশন। আপনি উদাহরণ সেকশনে মাউস নিয়ে গেলে উপরের কোণায় কোড copy করার একটি অপশন দেখতে পাবেন। copy অপশনে মাউস ক্লিক করলে ক্লিপবোর্ডে কোড কপি হবে।

আপনি আপনার এডিটর ওপেন করে copy করা কোড paste করতে পারবেন। এছাড়া উদাহরণ সেকশনের নিচে উদাহরণের ফলাফলও দেখানো হয়েছে।

kt_satt_skill_example_id=10

জাভাস্ক্রিপ্ট কেন শিখবেন?

ওয়েব ডেভেলপমেন্ট এর জন্য তিনটি প্রোগ্রামিং ল্যাংগুয়েজ ব্যবহৃত হয়।

জাভাস্ক্রিপ্ট এই ৩টি ল্যাংগুয়েজের মধ্যে অন্যতম যা প্রত্যেক ওয়েব ডেভেলপারের জন্যই জানা আবশ্যকঃ

১. এইচটিএমএল ওয়েব পেজের কন্টেন্ট সরবরাহ করে।

২. সিএসএস ওয়েব পেজের নকশা তৈরি করে।

৩. জাভাস্ক্রিপ্ট ওয়েব পেজের কাজের ধারা/আচরণ ঠিক করে।

এই টিউটোরিয়ালে জাভাস্ক্রিপ্ট এবং জাভাস্ক্রিপ্ট কিভাবে এইচটিএমএল এবং সিএসএসের সাথে কাজ করে সে সম্বন্ধে আলোচনা করা হয়েছে।

জাভাস্ক্রিপ্ট সারা বিশ্বের মধ্যে সবচেয়ে জনপ্রিয় প্রোগ্রামিং ভাষা।

চলুন উদাহরণের সাহায্যে জাভাস্ক্রিপ্টের কিছু ব্যবহার দেখি।

জাভাস্ক্রিপ্ট এইচটিএমএল কন্টেন্ট পরিবর্তন করতে পারে

জাভাস্ক্রিপ্টে বহুবিধ মেথড রয়েছে তন্মধ্যে getElementById() মেথডটি অন্যতম।

এই উদাহরনে getElementById() মেথডটি id="test" যুক্ত এইচটিএমএল এলিমেন্টকে খুঁজে বের করার জন্য ব্যবহার করা হয়েছে এবং এলিমেন্টের কন্টেন্ট "হ্যালো জাভাস্ক্রিপ্ট" দ্বারা পরিবর্তন করা হয়েছে।

জাভাস্ক্রিপ্ট এইচটিএমএল এট্রিবিউট পরিবর্তন করতে পারে

এই উদাহরণটিতে <input> ট্যাগের type এট্রিবিউট পরিবর্তন করা হয়েছেঃ

জাভাস্ক্রিপ্ট এইচটিএমএল স্টাইল পরিবর্তন করতে পারে

এইচটিএমএল এলিমেন্টের এট্রিবিউট পরিবর্তন করা থেকে এইচটিএমএল স্টাইল পরিবর্তন করা একটু ভিন্নঃ

জাভাস্ক্রিপ্ট কোথায় রাখবেন?

এইচটিএমএল পেজের মধ্যে <head> অথবা <body> অথবা উভয় ট্যাগ এর মধ্যে জাভাস্ক্রিপ্টকে রাখা যায়।

<script> ট্যাগ এর মধ্যে জাভাস্ক্রিপ্ট কোড লিখতে হয়।

<script> ট্যাগ

আপনি যদি এইচটিএমএল এর মধ্যে জাভাস্ক্রিপ্ট কোড ব্যবহার করতে চান তাহলে জাভাস্ক্রিপ্ট কোডকে অবশ্যই <script> এবং </script> ট্যাগের মধ্যে লিখতে হবে।

জাভাস্ক্রিপ্ট এর পুরাতন ভার্সন সমূহে type এট্রিবিউট ব্যবহার করা হত। যেমনঃ <script type="text/javascript">।
কিন্তু বর্তমানে আর এটার প্রয়োজন নাই। কারণ জাভাস্ক্রিপ্ট এইচটিএমএলের পূর্বনির্ধারিত স্ক্রিপ্টিং ল্যাংগুয়েজ।

জাভাস্ক্রিপ্ট ফাংশন এবং ইভেন্ট

জাভাস্ক্রিপ্ট ফাংশন হচ্ছে একগুচ্ছ জাভাস্ক্রিপ্ট কোড যাকে আপনি "কল" করলে সম্পাদিত হবে।

উদাহরণস্বরূপঃ কোন ইভেন্ট(ঘটনা) ঘটলেই একটি ফাংশন সম্পাদিত হবে। যেমনঃ ব্যবহারকারী যদি মাউস ক্লিক করে।

পরবর্তীতে ফাংশন এবং ইভেন্ট সম্পর্কে বিস্তারিত আলোচনা করা হয়েছে।

<head> অথবা <body> এর মধ্যে জাভাস্ক্রিপ্ট

এইচটিএমএল ডকুমেন্টের মধ্যে আপনি যত খুশি জাভাস্ক্রিপ্ট কোড লিখতে/রাখতে পারবেন।

জাভাস্ক্রিপ্টকে এইচটিএমএলের <body> অথবা <head> অথবা উভয়ের মধ্যেই রাখা যেতে পারে।

	সবচেয়ে ভাল অভ্যাস হচ্ছে সকল কোড একই স্থানে রাখা।

<head>এলিমেন্টে জাভাস্ক্রিপ্ট

এই উদাহরণে জাভাস্ক্রিপ্ট ফাংশনকে এইচটিএমএল পেজের <head> অংশে রাখা হয়েছে।

বাটনে ক্লিক করলে ফাংশনটি আপনার ডাকে সাড়া দিবেঃ

<body> এর মধ্যে জাভাস্ক্রিপ্ট

এই উদাহরণে জাভাস্ক্রিপ্ট ফাংশনকে এইচটিএমএল পেজের <body> এলিমেন্টে রাখা হয়েছে

বাটনে ক্লিক করলে ফাংশনটি আপনার ডাকে সাড়া দিবেঃ

	জাভাস্ক্রিপ্টকে `<body>` এলিমেন্টের নিচের দিকে রাখা সবচেয়ে ভাল অভ্যাস। এতে আপনার পেজ দ্রুত লোড হয়। কারণ জাভাস্ক্রিপ্ট কম্পাইলার আপনার পেজকে ধীরগতি সম্পন্ন করে দিতে পারে।

বাহ্যিক জাভাস্ক্রিপ্ট

জাভাস্ক্রিপ্টকে বাহ্যিক(external) ফাইলের মধ্যেও রাখা যায়ঃ

একই ধরণের স্ক্রিপ্ট কোড যখন একাধিক ওয়েব পেজে ব্যবহার করার প্রয়োজন হয় তখন এক্সটার্নাল জাভাস্ক্রিপ্ট ব্যবহার করতে হয়।

জাভাস্ক্রিপ্ট ফাইলের ফাইল এক্সটেনশন হচ্ছে .js।

এক্সটার্নাল জাভাস্ক্রিপ্ট ব্যবহার করার জন্য জাভাস্ক্রিপ্ট ফাইলটি <script> ট্যাগের src এট্রিবিউটের মধ্যে রাখুনঃ

এক্সটার্নাল জাভাস্ক্রিপ্ট রেফারেন্স/ফাইলকে আপনি আপনার ইচ্ছামত <head> অথবা <body> এর মধ্যে রাখতে পারেন।

রেফারেন্স কোডগুলো এমন আচরণ করে যেন এগুলোকে <script> ট্যাগের মধ্যেই রাখা হয়েছে।

	এক্সটার্নাল স্ক্রিপ্টের মধ্যে `<script>` ট্যাগ ব্যবহার করা যাবে না।

এক্সটার্নাল জাভাস্ক্রিপ্টের সুবিধা

জাভাস্ক্রিপ্টকে এক্সটার্নাল ফাইলের মধ্যে রাখলে কিছু বিশেষ বিশেষ সুবিধা পাওয়া যায়ঃ

এটা এইচটিএমএল এবং জাভাস্ক্রিপ্ট কোডকে পৃথক করে।
এইচটিএমএল এবং জাভাস্ক্রিপ্ট কোড অধিক পাঠযোগ্য হয় এবং খুব সহজেই রক্ষণাবেক্ষণ করা যায়।
ক্যাশড(cached) জাভাস্ক্রিপ্ট ফাইল পেজ লোডের গতি বাড়িয়ে দেয়।

জাভাস্ক্রিপ্ট টিউটোরিয়াল লিস্ট

Content added || updated By

Ibnul Haisan

জাভাস্ক্রিপ্ট আউটপুট (JS Output)

জাভাস্ক্রিপ্ট প্রদর্শনের পদ্ধতি

জাভাস্ক্রিপ্ট বিভিন্ন পদ্ধতিতে তথ্যকে প্রদর্শন করতে পারেঃ

window.alert() ব্যবহার করে এলার্ট বক্সের মাধ্যমে
document.write() ব্যবহার করে এইচটিএমএল ডকুমেন্টে লিখে
.innerHTML ব্যবহার করে এইচটিএলএল এলিমেন্টে লিখে
console.log() ব্যবহার করে ব্রাউজার কনসোলের মধ্যে দেখানো যায়

window.alert() ব্যবহার

তথ্য প্রদর্শনীর জন্য আপনি এলার্ট বক্স ব্যবহার করতে পারবেনঃ

kt_satt_skill_example_id=35

document.write() ব্যবহার

পরীক্ষা করার উদ্দ্যেশে document.write() ব্যবহার করা সুবিধাজনকঃ

kt_satt_skill_example_id=35

এইচটিএমএল এলিমেন্ট সম্পূর্ন লোড হওয়ার পর document.write() ব্যবহার করলে আগের সকল এইচটিএমএলকে মুছে ফেলেঃ

kt_satt_skill_example_id=35

Note শুধুমাত্র পরীক্ষা করার জন্য document.write() পদ্ধতিটি ব্যবহার করা উচিত।

innerHTML ব্যবহার

এইচটিএমএল এলিমেন্টকে এক্সেস করার জন্য জাভাস্ক্রিপ্ট document.getElementById(id) পদ্ধতিটি ব্যবহার করা হয়।

id এট্রিবিউটটি এইচটিএমএল এলিমেন্টকে নির্দেশ করে এবং innerHTML প্রোপার্টিটি এইচটিএমএল কন্টেন্টকে নির্দেশ করেঃ

kt_satt_skill_example_id=35

	এইচটিএমএল এলিমেন্টের innerHTML প্রোপার্টিকে পরিবর্তন করার মাধ্যমে এইচটিএমএলে ডাটা প্রদর্শন করা একটি সাধারণ পদ্ধতি।

console.log() ব্যবহার

আপনার ব্রাউজার কনসোলে ডাটা ডিসপ্লের জন্য আপনি console.log() পদ্ধতি ব্যবহার করতে পারেন।

F12 এর মাধ্যমে ব্রাউজার কনসোল সক্রিয় করা হয় এবং মেনু থেকে "Console" নির্বাচন করি।

kt_satt_skill_example_id=35

Content added || updated By

Ibnul Haisan

জাভাস্ক্রিপ্ট গঠনপ্রণালী (JS Syntax)

জাভাস্ক্রিপ্ট প্রোগ্রাম

একটি কম্পিউটার প্রোগ্রাম একগুচ্ছ "ইন্সট্রাকশন/নির্দেশনার" তালিকা যা কম্পিউটারের মাধ্যমে সম্পাদিত হয়।

প্রোগ্রামিং-এ এই নির্দেশনাগুলোকে স্টেটমেন্ট বলা হয়।

জাভাস্ক্রিপ্ট একটি প্রোগ্রামিং ল্যাংগুয়েজ।

সেমিকোলন(;) এর মাধ্যমে জাভাস্ক্রিপ্ট স্টেটমেন্টকে আলাদা করা হয়।

kt_satt_skill_example_id=80

	এইচটিএমএলে জাভাস্ক্রিপ্ট প্রোগ্রামগুলো ব্রাউজারের মাধ্যমে সম্পাদিত হয়।

জাভাস্ক্রিপ্ট স্টেটমেন্ট

জাভাস্ক্রিপ্ট স্টেটমেন্ট সাধারণত ভ্যালু, অপারেটর, এক্সপ্রেশন, কিওয়ার্ড এবং কমেন্ট নিয়ে তৈরি হয়।

জাভাস্ক্রিপ্ট ভ্যালু

জাভাস্ক্রিপ্টে দুই ধরণের ভ্যালু ব্যবহার করা হয়। যথা- ফিক্সড ভ্যালু এবং ভ্যারিয়েবল ভ্যালু।

ফিক্সড ভ্যালুকে লিটারাল বলা হয়। ভ্যারিয়েবল ভ্যালুকে চলক বা ভ্যারিয়েবল বলা হয়।

জাভাস্ক্রিপ্ট লিটারাল

ফিক্সড ভ্যালু লেখার সবচেয়ে গুরুত্বপূর্ণ নিয়ম হলোঃ

সংখ্যাকে পূর্ণ সংখ্যা অথবা দশমিকে লেখাঃ

kt_satt_skill_example_id=84

স্ট্রিং হচ্ছে টেক্সট যাকে সিঙ্গেল অথবা ডাবল কোটেশনের(উদ্ধৃতি চিহ্ন) মধ্যে লেখা হয়ঃ

kt_satt_skill_example_id=86

জাভাস্ক্রিপ্ট ভ্যারিয়েবল

প্রোগ্রামিং ভাষায় ভ্যালু সংরক্ষন করার কাজে ভ্যারিয়েবল ব্যবহার করা হয়।

ভ্যারিয়েবল ডিক্লেয়ার করার সময় জাভাস্ক্রিপ্টে var কিওয়ার্ড ব্যবহার করা হয়।

ভ্যারিয়েবলের মধ্যে মান রাখার জন্য সমান(=) চিহ্ন ব্যবহার করা হয়।

নিচের উদাহরণে a কে প্রথমে var কিওয়ার্ডের মাধ্যমে ভ্যারিয়েবল হিসেবে ডিক্লেয়ার করা হয়, তারপর সমান চিহ্ন ব্যবহার করে এর মধ্যে 10 কে ভ্যালু হিসেবে রাখা হয়েছে।

kt_satt_skill_example_id=88

জাভাস্ক্রিপ্ট অপারেটর

ভ্যারিয়েবলের মধ্যে মান রাখার জন্য জাভাস্ক্রিপ্টে সাধারণত এসাইনমেন্ট অপারেটর( = ) ব্যবহার করা হয়ঃ

kt_satt_skill_example_id=95

মান নির্ণয় করার জন্য জাভাস্ক্রিপ্টে সাধারণত গাণিতিক অপারেটর( + - * / ) ব্যবহার করা হয়ঃ

kt_satt_skill_example_id=96

জাভাস্ক্রিপ্ট এক্সপ্রেশন

কিছু ভ্যালু, চলক এবং অপারেটরের সমন্বয়ে জাভাস্ক্রিপ্ট এক্সপ্রেশন গঠিত হয় যা একটি ভ্যালু নির্ণয় করে।

উদাহরণস্বরূপ, ৫ * ১০ এর গুণন ৫০ এ রূপান্তরিত হয়।

kt_satt_skill_example_id=102

অনেক সময় এক্সপ্রেশনের মধ্যে ভ্যালু হিসেবে ভ্যারিয়েবলও থাকতে পারেঃ

kt_satt_skill_example_id=104

জাভাস্ক্রিপ্টে মানগুলো বিভিন্ন টাইপের হতে পারে। যেমনঃ নাম্বার এবং স্ট্রিং।

উদাহরণস্বরূপ, "সাহীদ" + " " + "মাহমুদ", যোগ হয়ে "সাহীদ মাহমুদ" হয়ঃ

kt_satt_skill_example_id=109

জাভাস্ক্রিপ্ট কিওয়ার্ড

বিভিন্ন কার্যসম্পাদন করার জন্য জাভাস্ক্রিপ্ট কিওয়ার্ড ব্যবহার করা হয়।

যেমন- var কিওয়ার্ড ব্রাউজারকে ভ্যারিয়েবল(variable) তৈরি করতে বলেঃ

kt_satt_skill_example_id=110

জাভাস্ক্রিপ্ট কমেন্ট

জাভাস্ক্রিপ্টের সকল স্টেটমেন্ট সম্পাদিত হয়না।

ডাবল স্ল্যাস(//)এর পরের অথবা /* এবং */ এর মাঝের কোডগুলোকে কমেন্ট হিসাবে গণ্য করা হয়।

কমেন্টের কোডগুলোকে উপেক্ষা করা হয় এবং এগুলো সম্পাদিত হবে নাঃ

kt_satt_skill_example_id=114

জাভাস্ক্রিপ্ট আইডেন্টিফায়ার

আইডেন্টিফায়ারসমূহ হচ্ছে নাম

জাভাস্ক্রিপ্টে ভ্যারিয়েবল,কীওয়ার্ড এবং ফাংশনের নাম দেওয়ার জন্য আইডেন্টিফায়ার ব্যবহার করা হয়।

অধিকাংশ প্রোগ্রামেই নামকরনের নিয়ম একই থাকে।

জাভাস্ক্রিপ্টে প্রথম ক্যারেক্টারটি অবশ্যই অক্ষর, আন্ডারস্কোর(_) অথবা ডলার($) চিহ্ন হবে।

পরের ক্যারেক্টারগুলো অক্ষর(characters), সংখ্যা, আন্ডারস্কোর(_) অথবা ডলার($) চিহ্ন হতে পারে।

	প্রথম অক্ষরটি কখনো সংখ্যা হবে না। এই পদ্ধতিতে জাভাস্ক্রিপ্ট খুব সহজেই নাম্বার থেকে আইডেন্টিফায়ারকে পৃথক করতে পারে।

জাভাস্ক্রিপ্ট কেস সেনসিটিভ

সকল জাভাস্ক্রিপ্ট আইডেন্টিফায়ার কেস-সেনসিটিভ(case-sensitive)।

lastName এবং lastname এই দুটি ভ্যারিয়েবল সম্পূর্ণ আলাদা

kt_satt_skill_example_id=116

জাভাস্ক্রিপ্ট VAR অথবা Var কে var কিওয়ার্ড হিসাবে বিবেচনা করে না।

জাভাস্ক্রিপ্ট ক্যামেল কেস

প্রোগ্রামাররা একের অধিক শব্দকে এক শব্দে লেখার জন্য সচারচর তিনটি পদ্ধতি ব্যবহার করেঃ

হাইফেন(-)

first-name, last-name, master-card, inter-city

আন্ডারস্কোর(_)

first_name, last_name, master_card, inter_city

ক্যামেল কেস

FirstName, LastName, MasterCard, InterCity

প্রোগ্রামিং ল্যাংগুয়েজে বিশেষত জাভাস্ক্রিপ্টে ক্যামেল কেস ছোট হাতের অক্ষর দিয়ে শুরু হয়ঃ

firstName, lastName, masterCard, interCity.

	জাভাস্ক্রিপ্টে হাইফেন(-) ব্যবহার করা যায় না। জাভাস্ক্রিপ্ট হাইফেনকে বিয়োগ চিহ্ন হিসাবে বিবেচনা করে।

জাভাস্ক্রিপ্ট ক্যারেক্টার সেট

জাভাস্ক্রিপ্ট ইউনিকোড ক্যারেক্টার সেট ব্যবহার করে।

ইউনিকোডে প্রায় সকল ক্যারেক্টার, সিম্বল এবং পাংচুয়েশন থাকে।

Content added || updated By

Ibnul Haisan

জাভাস্ক্রিপ্ট স্টেটমেন্ট (JS Statement)

এইচটিএমএলে জাভাস্ক্রিপ্ট স্টেটমেন্ট হচ্ছে "নির্দেশাবলী" যা ব্রাউজারের মাধ্যমে সম্পাদিত হয়।

জাভাস্ক্রিপ্ট স্টেটমেন্ট

নিচের স্টেটমেন্টটি ব্রাউজারকে id="test" সম্বলিত এইচটিএমএল এলিমেন্টের মধ্যে "Satt Academy" লিখতে বলেঃ

kt_satt_skill_example_id=133

জাভাস্ক্রিপ্ট প্রোগ্রাম

অধিকাংশ জাভাস্ক্রিপ্ট প্রোগ্রামেই অনেক জাভাস্ক্রিপ্ট স্টেটমেন্ট থাকে।

স্টেটমেন্টগুলো ক্রমানুসারে একের পর এক সম্পাদিত হয়।

নিচের উদাহরণে প্রথমে x, y এবং z এর মান নির্ধারণ করা হয়। পরিশেষে z এর মান প্রদর্শিত হয়।

kt_satt_skill_example_id=134

	জাভাস্ক্রিপ্ট প্রোগ্রাম এবং জাভাস্ক্রিপ্ট স্টেটমেন্টকে জাভাস্ক্রিপ্ট কোড বলা হয়।

সেমিকোলন (;)

সেমিকোলনের মাধ্যমে জাভাস্ক্রিপ্ট স্টেটমেন্টগুলোকে আলাদা করা হয়।

সম্পাদনযোগ্য প্রত্যেক স্টেটমেন্টের পরে সেমিকোলন যোগ করুনঃ

kt_satt_skill_example_id=137

সেমিকোলনের মাধ্যমে স্টেটমেন্টকে আলাদা করলে একই লাইনে অনেক স্টেটমেন্ট লেখা যায়ঃ

kt_satt_skill_example_id=142

	অনেকক্ষেত্রে আপনি সেমিকোলন ছাড়াও স্টেটমেন্ট দেখতে পারেন। সেমিকোলনের মাধ্যমে স্টেটমেন্টকে আলাদা না করলেও চলে, কিন্তু আমরা আপনাকে সেমিকোলন ব্যবহার করতে সুপারিশ করছি।

জাভাস্ক্রিপ্ট স্পেস

জাভাস্ক্রিপ্ট একের অধিক স্পেসকে এড়িয়ে চলে। শুধুমাত্র আপনার পড়ার সুবিধার্থে অতিরিক্ত স্পেস যোগ করতে পারেন।

নিচের লাইনগুলো একই রকমঃ

kt_satt_skill_example_id=145

অপারেটরের ( = + - * / ) উভয়পাশে স্পেস রাখা একটি ভাল অভ্যাসঃ

kt_satt_skill_example_id=149

জাভাস্ক্রিপ্ট লাইনের দৈর্ঘ্য এবং লাইনের বিরতি

অধিক স্পষ্টতার জন্য প্রোগ্রামাররা ৮০ অক্ষরের চাইতে বড় লাইনের কোডকে এড়িয়ে চলে

যদি জাভাস্ক্রিপ্ট স্টেটমেন্ট এক লাইনে সম্পূর্ণ করা না যায়, তাহলে অপারেটরের পরে লাইন ব্রেক করে পরবর্তী লাইনে বাকী অংশটুকু লিখুনঃ

kt_satt_skill_example_id=152

জাভাস্ক্রিপ্ট কোড ব্লক

জাভাস্ক্রিপ্ট স্টেটমেন্টগুলোকে দ্বিতীয় বন্ধনীর{...} মাধ্যমে কোড ব্লকের মাধ্যমে একত্রিত করা যায়।

কোড ব্লকের উদ্দেশ্য হচ্ছে স্টেটমেন্টগুলোকে একসাথে সম্পাদন করা।

জাভাস্ক্রিপ্টে মাঝে মাঝে স্টেটমেন্টগুলোকে ব্লকের মধ্যে একসাথে দেখতে পাবেন সেটা হচ্ছে জাভাস্ক্রিপ্ট ফাংশনঃ

kt_satt_skill_example_id=156

	পরবর্তী টিউটোরিয়ালে ফাংশন সম্মন্ধে আপনি আরো শিখবেন।

জাভাস্ক্রিপ্ট কিওয়ার্ড

জাভাস্ক্রিপ্টে নির্দিষ্ট কার্য সম্পাদন করার জন্য প্রায়ই কিওয়ার্ড দিয়ে স্টেটমেন্ট শুরু হয়।

এখানে কিছু কিওয়ার্ডের তালিকা দেওয়া আছে যা আপনি এই টিউটোরিয়ালে শিখবেনঃ

কিওয়ার্ড	বর্ণনা
break	switch অথবা loop কে বন্ধ করে দেয়
continue	লুপ হতে বের হয়ে যায় এবং উপর হতে পূনরায় শুরু করে
debugger	জাভাস্ক্রিপ্ট এক্সিকিউশনকে থামিয়ে দেয় এবং ডিবাগিং ফাংশন থাকলে তাকে কল করে
do ... while	প্রথমে do ব্লকের স্টেটমেন্ট সম্পাদিত হয় এবং while এর শর্ত সত্য হলে ব্লকটির পুনরাবৃত্তি ঘটে
for	যতক্ষণ শর্ত সত্য থাকবে ততক্ষণ একটি ব্লকের স্টেটমেন্টগুলো সম্পাদন হতে থাকবে
function	ফাংশন ঘোষণা করে
if ... else	শর্তের উপর ভিত্তি করে যেকোন একটি স্টেটমেন্টের ব্লক সম্পাদিত হয়
return	ফাংশন থেকে বের হয়ে যায়
switch	বিভিন্ন অবস্থা/ঘটনার উপর ভিত্তি করে একটি স্টেটমেন্টের ব্লক একবার সম্পাদিত হয়
try ... catch	একটি স্টেটমেন্টের ব্লকে ভুল নিয়ন্ত্রণ করে
var	চলক বা ভ্যারিয়েবল ডিক্লেয়ার করে

	জাভাস্ক্রিপ্ট কিওয়ার্ডগুলো সংরক্ষিত শব্দ যেগুলো ভ্যারিয়েবলের নামের জন্য ব্যবহার করা যাবেনা।

Content added || updated By

Ibnul Haisan

জাভাস্ক্রিপ্ট মন্তব্য (JS Comment)

জাভাস্ক্রিপ্ট কোডকে ব্যাখ্যা করার জন্য এবং অধিক পাঠযোগ্য করে তোলার জন্য জাভাস্ক্রিপ্ট কমেন্ট ব্যবহার করা হয়।

কোডকে সম্পাদন থেকে বিরত রাখার জন্যও জাভাস্ক্রিপ্ট কমেন্ট ব্যবহার করা হয়। বিশেষ করে বিকল্প কোনো কোডকে টেস্ট করার সময় কমেন্ট ব্যবহার করা হয়।

এক লাইনের কমেন্ট

এক লাইনের কমেন্ট // দিয়ে শুরু হয়।

// এর পরে যেকোন ধরণের টেক্সট কে জাভাস্ক্রিপ্ট এড়িয়ে চলে।

নিচের উদাহরণে কোডকে ব্যাখ্যা করার জন্য প্রতি লাইনের আগে এক লাইনের কমেন্ট করা হয়েছে।

kt_satt_skill_example_id=161

নিচের উদাহরণে কোডের বর্ণনা করার জন্য প্রতি লাইন কোডের শেষে এক লাইনের কমেন্ট যোগ করা হয়েছেঃ

kt_satt_skill_example_id=166

একের অধিক লাইনের কমেন্ট

একের অধিক লাইনের কমেন্ট /* দিয়ে শুরু হয় এবং */ দিয়ে শেষ হয়।

/* এবং */ এর মধ্যে যেকোন ধরণের টেক্সটকে জাভাস্ক্রিপ্ট এড়িয়ে চলে।

নিচের উদাহরণে কোড বুঝার জন্য একের অধিক লাইনের কমেন্ট ব্যবহার করা হয়েছে:

kt_satt_skill_example_id=168

	অধিকাংশক্ষেত্রেই এক লাইনের কমেন্ট ব্যবহার করা হয়। ডকুমেন্ট লেখার ক্ষেত্রে একের অধিক লাইনের কমেন্ট লেখা হয়।

কমেন্টের মাধ্যমে কোড সম্পাদনে বাধা দেওয়া

কোড টেস্টের ক্ষেত্রে কমেন্টের মাধ্যমে কোড সম্পাদনকে বাধা দেওয়া উচিত।

নিচের উদাহরণে // ব্যবহার করে প্রথম লাইনকে সম্পাদন থেকে বাধা দেওয়া হয়েছেঃ

kt_satt_skill_example_id=170

নিচের উদাহরণে একাধিক লাইনের কোডকে সম্পাদন থেকে বাধা দিতে কমেন্ট ব্লক ব্যবহার করা হয়েছেঃ

kt_satt_skill_example_id=172

Content added By

Ibnul Haisan

জাভাস্ক্রিপ্ট ডাটা টাইপ (JS Data Type)

স্ট্রিং(String), সংখ্যা(Number), বুলিয়ান(Boolean), অ্যারে(Array), অবজেক্ট(Object)।

জাভাস্ক্রিপ্ট তথ্যের ধরন(Data Type)

জাভাস্ক্রিপ্ট ভ্যারিয়েবল অনেক টাইপের ডাটা জমা রাখতে পারেঃ সংখ্যা(number), স্ট্রিং(string), অ্যারে(array), অবজেক্ট(object) এবং আরো অনেকঃ

kt_satt_skill_example_id=203

ডাটা টাইপের ধারনা

প্রোগ্রামিং-এর ক্ষেত্রে, ডাটা টাইপ একটি গুরুত্বপূর্ন বিষয়।

ভ্যারিয়েবল নিয়ে কাজ করতে হলে ডাটা টাইপ জানা খুবই গুরুত্বপূর্ণ।

ডাটা টাইপ ছাড়া কম্পিউটার এগুলোকে(ডাটাকে) সঠিকভাবে সমাধান করতে পারেনাঃ

kt_satt_skill_example_id=209

28 এর সাথে "Tamim" যোগ করা কি কোন অর্থ বহন করে? ইহা কি কোন ভুল(error) দেখাবে নাকি ফলাফল দিবে?

জাভাস্ক্রিপ্ট উপরের উদাহরণকে নিচের মত ভাববেঃ

kt_satt_skill_example_id=210

	যখন সংখ্যাকে স্ট্রিং-এর সাথে যোগ করা হয়, জাভাস্ক্রিপ্ট সংখ্যাকে স্ট্রিং হিসাবে গণ্য করে।

kt_satt_skill_example_id=211

kt_satt_skill_example_id=212

জাভাস্ক্রিপ্ট এক্সপ্রেশনকে বাম থেকে ডান দিকে সম্পাদন করে। ডাটা টাইপের ধারাবাহিকতা ভিন্ন ভিন্ন ফলাফল প্রদর্শন করতে পারেঃ

kt_satt_skill_example_id=213

kt_satt_skill_example_id=214

প্রথম উদাহরণে, 28 এবং 12কে সংখ্যা হিসাবে বিবেচনা করে যোগ করে তারপর "Tamim" যেহেতু স্ট্রিং তাই জাভাস্ক্রিপ্ট সম্পূর্নটাকে স্ট্রিং বিবেচনা করে।

দ্বিতীয় উদাহরণে, প্রথম অপারেন্ড স্ট্রিং হওয়ায় সকল অপারেন্ডকেই স্ট্রিং হিসাবে গণ্য করা হয়েছে।

জাভাস্ক্রিপ্ট ডায়নামিক ডাটা টাইপ

জাভাস্ক্রিপ্টে ডাটা টাইপ ডায়নামিক। এর অর্থ একই ভ্যারিয়েবলে বিভিন্ন টাইপের ডাটা রাখা যেতে পারেঃ

kt_satt_skill_example_id=215

জাভাস্ক্রিপ্ট স্ট্রিং(String)

স্ট্রিং(string) হচ্ছে কিছু অক্ষরের(character) ধারা। যেমন- "আজিজুর রহমান"।

স্ট্রিংকে উদ্ধৃতি(quote) চিহ্নের মধ্যে লিখতে হয়। আপনি সিঙ্গেল অথবা ডাবল কোটেশন ব্যবহার করতে পারেনঃ

kt_satt_skill_example_id=227

আপনি স্ট্রিং-এর মধ্যেও কোটেশন ব্যবহার করতে পারেন, তবে স্ট্রিং-এর উভয় পাশের কোটেশনের সাথে মিলতে পারবে নাঃ

kt_satt_skill_example_id=229

এই টিউটোরিয়ালের পরবর্তী পরিচ্ছেদে স্ট্রিং সম্পর্কে আপনি আরো শিখবেন।

জাভাস্ক্রিপ্ট সংখ্যা

জাভাস্ক্রিপ্টে শুধু এক ধরণের সংখ্যা আছে।

সংখ্যাকে দশমিক অথবা দশমিক ছাড়াও লেখা যায়ঃ

kt_satt_skill_example_id=231

অতিরিক্ত বড় অথবা অতিরিক্ত ছোট সংখ্যাকে বৈজ্ঞানিক (exponential) পদ্ধতিতে লেখা যেতে পারেঃ

kt_satt_skill_example_id=233

এই টিউটোরিয়ালের পরবর্তী পরিচ্ছেদে সংখ্যা সম্পর্কে আপনি আরো শিখবেন।

জাভাস্ক্রিপ্ট বুলিয়ান(Boolean)

বুলিয়ানের শুধুমাত্র দুইটি মান থাকেঃ true অথবা false ।

kt_satt_skill_example_id=235

শর্ত পরীক্ষা(Condition Test) করার জন্য প্রায়ই বুলিয়ান ব্যবহার করা হয়।

এই টিউটোরিয়ালের পরবর্তী পরিচ্ছেদে শর্ত পরীক্ষা(Condition Test) সম্পর্কে আপনি আরো অনেক কিছু শিখবেন।

জাভাস্ক্রিপ্ট অ্যারে(Array)

জাভাস্ক্রিপ্ট অ্যারেকে তৃতীয় বন্ধনীর(Square Bracket) মাধ্যমে লিখতে হয়।

অ্যারের উপাদানগুলো(items) কমার(,) মাধ্যমে আলাদা করতে হয়।

নিচের উদাহরণে animals নামের একটি অ্যারে ভ্যারিয়েবল ডিক্লেয়ার করা হয়েছে, যার মধ্যে তিনটি মান রয়েছেঃ

kt_satt_skill_example_id=236

অ্যারের ইনডেক্স(index) শুরু হয় 0 দিয়ে, অর্থাৎ প্রথম উপাদানটি হবে [0],দ্বিতীয় উপাদানটি হবে [1], এবং এভাবে চলতে থাকবে।

এই টিউটোরিয়ালের পরবর্তী পরিচ্ছেদে অ্যারে(Array) সম্পর্কে আপনি আরো শিখবেন।

জাভাস্ক্রিপ্ট অবজেক্ট(Object)

দ্বিতীয় বন্ধনীর(curly bracket) মাধ্যমে জাভাস্ক্রিপ্ট অবজেক্ট লেখা হয়।

অবজেক্টের প্রোপার্টিগুলো name:value জোড়া আকারে লিখতে হয়, একাধিক প্রোপার্টিকে কমার(,) মাধ্যমে পৃথক করতে হয়।

kt_satt_skill_example_id=237

উপরের উদাহরণে person অবজেক্টের চারটি প্রোপার্টি আছেঃ firstName, lastName, age, and eyeColor

এই টিউটোরিয়ালের পরবর্তী পরিচ্ছেদে অবজেক্ট(Object) সম্পর্কে আপনি আরো শিখবেন।

typeof অপারেটর

জাভাস্ক্রিপ্ট ভ্যারিয়েবলের টাইপ জানতে আপনি typeof অপারেটর(operator) ব্যবহার করতে পারেনঃ

kt_satt_skill_example_id=238

	জাভাস্ক্রিপ্টে অ্যারে হচ্ছে বিশেষ ধরণের অবজেক্ট(object)। তাই অ্যারের টাইপ অবজেক্ট(Object)।

অসংজ্ঞায়িত(Undefined)

জাভাস্ক্রিপ্টে ভ্যারিয়েবলকে ভ্যালু ছাড়া ডিক্লেয়ার করলে এর একটি ভ্যালু থাকে undefined। typeof এর মানও undefined ।

kt_satt_skill_example_id=241

ভ্যারিয়েবলের মান undefined সেট করে এর মান খালি রাখা যায়।

kt_satt_skill_example_id=246

খালি মান(Empty Values)

খালি মান(value) আর অসজ্ঞায়িত দুইটি ভিন্ন জিনিস।

খালি স্ট্রিং-এর ভ্যালু এবং টাইপ(type) দুইটাই থাকে।

kt_satt_skill_example_id=249

ফাকা(Null)

জাভাস্ক্রিপ্টে null দ্বারা বুঝায় "কিছুই না"। এটা দ্বারা বুঝায় যার কোন অস্তিত্ব নাই।

জাভাস্ক্রিপ্টে, null এর ডাটা টাইপ হচ্ছে অবজেক্ট(object)।

	জাভাস্ক্রিপ্টে null এর typeof অপারেটরের ভ্যালু হচ্ছে অবজেক্ট, আপনি একে bug হিসেবে বিবেচনা করতে পারেন।কারণ এটা null হওয়া উচিৎ ছিল।

আপনি অবজেক্টের মান null সেট করে একে খালি রাখতে পারেনঃ

kt_satt_skill_example_id=252

Undefined এবং Null এর মধ্যে পার্থক্য

kt_satt_skill_example_id=253

Content added || updated By

Ibnul Haisan

জাভাস্ক্রিপ্ট চলক (JS Variable)

জাভাস্ক্রিপ্ট ভ্যারিয়েবল

জাভাস্ক্রিপ্ট ভ্যারিয়েবল হচ্ছে ভ্যালু রাখার জন্য ব্যবহৃত কন্টেইনার।

নিচের উদাহরণে a, b এবং c হচ্ছে ভ্যারিয়েবলঃ

kt_satt_skill_example_id=261

উপরের উদাহরনে লক্ষ্য করুন a, b এবং c নামের তিনটি ভ্যারিয়েবল আছেঃ

a ভ্যারিয়েবলে সংরক্ষিত হয় 10
b ভ্যারিয়েবলে সংরক্ষিত হয় 20
c ভ্যারিয়েবলে সংরক্ষিত হয় 30 (10 + 20 = 30)

ভ্যারিয়েবল প্রায় বীজগণিতের মতই

উপরের উদাহরণে a, b এবং c হচ্ছে ভ্যারিয়েবলঃ

বীজগণিতের মত প্রোগ্রামিংয়ের ক্ষেত্রেও মান রাখার জন্য ভ্যারিয়েবল বা চলক (যেমন-a) ব্যবহার করা হয়।

বীজগণিতের মত প্রোগ্রামিংয়ের ক্ষেত্রেও আমরা এক্সপ্রেশনে ভ্যারিয়েবল ব্যবহার করি।
যেমনঃ (c = a + b)

উপরের উদাহরণ থেকে হিসাব করলে যোগফল হয় 30

	জাভাস্ক্রিপ্ট ভ্যারিয়েবল হচ্ছে ভ্যালু রাখার জন্য ব্যবহৃত কন্টেইনার।

জাভাস্ক্রিপ্ট আইডেন্টিফায়ার

সকল জাভাস্ক্রিপ্ট ভ্যারিয়েবল অবশ্যই একটি ইউনিক নামের মাধ্যমে সনাক্ত করতে হবে।

এই ইউনিক নামগুলোকে আইডেন্টিফায়ার বলে।

আইডেন্টিফায়ারগুলোর সংক্ষিপ্ত নাম হতে পারে (যেমন- x এবং y),অথবা বর্ণনামূলক নামও হতে পারে (যেমন-age, sum, totalVolume)।

ভ্যারিয়েবলের নাম দেওয়ার ক্ষেত্রে সাধারণ নিয়মগুলো হচ্ছেঃ

নামের মধ্যে অক্ষর(x, y, z), ডিজিট(1, 2, 3), আন্ডারস্কোর(_) এবং ডলার($) চিহ্ন থাকতে পারে
নাম অবশ্যই অক্ষর দিয়ে শুরু হবে
$ এবং _ দিয়েও নাম শুরু হতে পারে
নামগুলো কেসসেন্সিটিভ (যেমন x এবং X দুটি আলাদা ভ্যারিয়েবল)
সংরক্ষিত শব্দগুলোকে(যেমন- জাভাস্ক্রিপ্ট কিওয়ার্ড) কখনো নাম হিসাবে ব্যবহার করা যাবেনা

	জাভাস্ক্রিপ্ট আইডেন্টিফায়ারগুলো কেসসেন্সিটিভ।

এসাইনমেন্ট অপারেটর

জাভাস্ক্রিপ্টে সমান চিহ্নকে (=) "এসাইনমেন্ট" অপারেটর হিসাবে ব্যবহার করা হয়, যা দ্বারা "সমান" বুঝায় না। বরং ভ্যারিয়েবলের মধ্যে ভ্যালু এসাইন করা বুঝায়।

কম্পিউটারের ভ্যারিয়েবল বীজগণিতের ভ্যারিয়েবল থেকে আলাদা। নিচের লাইনটি বীজগণিতে কোন অর্থ বহন করে নাঃ

kt_satt_skill_example_id=266

কিন্তু জাভাস্ক্রিপ্টে এর অর্থ আছে, এর মানে x + 10 এর মান x এর মধ্যে জমা হয়।

এটা x + 10 এর মানকে গণনা করে এবং ফলাফল x এর মধ্যে জমা রাখে। এখানে x এর মান 10 বৃদ্ধি পায়।

	জাভাস্ক্রিপ্টে "==" অপারেটরটি সমান বুঝাতে লেখা হয়।

জাভাস্ক্রিপ্ট ডাটাটাইপ

জাভাস্ক্রিপ্ট ভ্যারিয়েবলের মধ্যে সংখ্যা(৪০),টেক্সট ভ্যালু ("আজিজুর রহমান") থাকতে পারে।

প্রোগ্রামিং-এ টেক্সট ভ্যালুকে টেক্সট স্ট্রিং বলে।

জাভাস্ক্রিপ্ট অনেক ধরণের তথ্য বা ডাটা পরিচালনা করতে পারে, কিন্তু এখন শুধু নাম্বার এবং স্ট্রিং শিখবো।

স্ট্রিংকে সিঙ্গেল বা ডাবল কোটেশনের(উদ্ধৃতির) মধ্যে লেখা হয়। সংখ্যাকে উদ্ধৃতি ছাড়াই লিখতে হয়।

যদি আপনি নাম্বারকে উদ্ধৃতির মধ্যে লিখেন তাহলে তা স্ট্রিং বলে গণ্য হবে।

kt_satt_skill_example_id=267

জাভাস্ক্রিপ্ট ভ্যারিয়েবল তৈরি

জাভাস্ক্রিপ্টে ভ্যারিয়েবল তৈরিকে অন্য ভাষায় ভ্যারিয়েবল ডিক্লেয়ারেশন বলে।

var কিওয়ার্ডের মাধ্যমে জাভাস্ক্রিপ্টে ভ্যারিয়েবল ডিক্লেয়ার করা হয়।

kt_satt_skill_example_id=268

ঘোষণা করার পরে এখন ভ্যারিয়েবলের কোন মান নাই। প্রকৃতপক্ষে এটার মান undefined

ভ্যারিয়েবলের মধ্যে মান রাখার জন্য আমরা সমান(=) চিহ্ন ব্যবহার করি।

kt_satt_skill_example_id=269

এমনকি ভ্যারিয়েবল ডিক্লেয়ারের সময়ই আপনি ভ্যারিয়েবলের মান দিয়ে দিতে পারেনঃ

kt_satt_skill_example_id=271

নিচের উদাহরণে আমরা academyName নামে ভ্যারিয়েবল ডিক্লেয়ার করে এর মান "Satt" দিয়েছি।

তারপরে আমরা id="test" সম্বলিত এইচটিএমএল এলিমেন্টের মধ্যে আউটপুট নিয়েছিঃ

kt_satt_skill_example_id=275

	সকল ভ্যারিয়েবলগুলোকে স্ক্রিপ্টের প্রথমেই ঘোষণা করা প্রোগ্রামিং-এ ভাল অভ্যাস।

একটি স্টেটমেন্টে অনেক ভ্যারিয়েবল

একটি স্টেটমেন্টের মধ্যে আপনি অনেক ভ্যারিয়েবল ডিক্লেয়ার করতে পারেন।

var কিওয়ার্ডের মাধ্যমে শুরু করুন এবং কমা(,) দ্বারা ভ্যারিয়েবলগুলো আলাদা করুন, সবশেষে সেমিকোলন(;) দিনঃ

kt_satt_skill_example_id=277

একের অধিক লাইনেও ডিক্লেয়ার করা যেতে পারেঃ

kt_satt_skill_example_id=278

Value = undefined

কম্পিউটার প্রোগ্রামিং-এ, প্রায়ই ভ্যারিয়েবলকে মান ছাড়াই ডিক্লেয়ার করা হয়, মানগুলো হয় পরে নির্ধারন করা হয় অথবা হিসাব করে পাওয়া যায়।

যখন ভ্যারিয়েবলকে মান ছাড়াই ডিক্লেয়ার করা হয় তখন এর মান হয় undefined।

নিচের স্টেটমেন্টকে সম্পাদন করার পর academyName ভ্যারিয়েবলের মান হয় অসংজ্ঞায়িত(undefined)

kt_satt_skill_example_id=279

জাভাস্ক্রিপ্ট ভ্যারিয়েবলকে পুনরায় ঘোষণা

জাভাস্ক্রিপ্ট ভ্যারিয়েবলকে পুনরায় ঘোষণা করলেও আগের মান হারায় না।

স্টেটমেন্টটি সম্পাদন হওয়ার পরেও acadmeyName ভ্যারিয়েবলের মান "স্যাট" থাকেঃ

kt_satt_skill_example_id=281

জাভাস্ক্রিপ্ট গণিত

বীজগণিতের মতই জাভাস্ক্রিপ্টের ভ্যারিয়েবলগুলোকে অপারেটরের সাহায্যে গাণিতিক যোগ-বিয়োগ করা যায়ঃ

kt_satt_skill_example_id=292

আপনি স্ট্রিংকেও যোগ করতে পারেন। কিন্তু এগুলো যোগ করলে যোগের পরিবর্তে পাশাপাশি(concatination) বসেঃ

kt_satt_skill_example_id=296

নিচেরটাও চেষ্টা করি

kt_satt_skill_example_id=298

	যদি আপনি একটি সংখ্যাকে কোটেশনের মধ্যে রাখেন তাহলে পরবর্তী সংখ্যাগুলোও স্ট্রিং-এ রূপান্তরিত হয় এবং এগুলো পাশাপাশি বসে।

Content added || updated By

Ibnul Haisan

জাভাস্ক্রিপ্ট লেট (JS Let)

Please, contribute to add content into জাভাস্ক্রিপ্ট লেট (JS Let).

Content

জাভাস্ক্রিপ্ট কন্স্‌ট (JS Const)

Please, contribute to add content into জাভাস্ক্রিপ্ট কন্স্‌ট (JS Const).

Content

জাভাস্ক্রিপ্ট স্কোপ (JS Scope)

স্কোপ হলো আপনি এক্সেস করতে পারেন এমন ভ্যারিয়েবলের সেট।

জাভাস্ক্রিপ্ট স্কোপ

জাভাস্ক্রিপ্টে অবজেক্ট এবং ফাংশনও ভ্যারিয়েবল।

আপনি এক্সেস করতে পারেন এমন ভ্যারিয়েবল, অবজেক্ট এবং ফাংশনের সেটকে জাভাস্ক্রিপ্টে স্কোপ বলা হয়।

জাভাস্ক্রিপ্টের ফাংশন স্কোপ রয়েছেঃ ফাংশনের মধ্যে স্কোপ পরিবর্তিত হয়।

জাভাস্ক্রিপ্ট লোকাল ভ্যারিয়েবল

জাভাস্ক্রিপ্ট ফাংশনের মধ্যে যে ভ্যারিয়েবল বা চলক ডিক্লেয়ার করা হয় তাকে লোকাল ভ্যারিয়েবল বলে।

লোকাল ভ্যারিয়েবলের লোকাল স্কোপ থাকেঃ যা শুধুমাত্র ফাংশনের মধ্যেই এক্সেস করা সম্ভব।

kt_satt_skill_example_id=321

যেহেতু লোকাল ভ্যারিয়েবল শুধুমাত্র একটি ফাংশনের ভিতরে এক্সেস করা যায়, তাই একই নামের ভ্যারিয়েবল বিভিন্ন ফাংশনের ভিতরে ব্যবহার করা যেতে পারে।

যখন ফাংশনকে কল করা হয় তখন লোকাল ভ্যারিয়েবল তৈরি হয় এবং ফাংশনের কাজ সম্পন্ন হলে লোকাল ভ্যারিয়েবলগুলো ডিলেট হয়ে যায়।

জাভাস্ক্রিপ্ট গ্লোবাল ভ্যারিয়েবল

জাভাস্ক্রিপ্ট ফাংশনের বাইরে যে ভ্যারিয়েবলকে ডিক্লেয়ার করা হয় তাকে গ্লোবাল ভ্যারিয়েবল বলে।

গ্লোবাল ভ্যারিয়েবলের গ্লোবাল স্কোপ থাকেঃ ওয়েব পেজের সকল স্ক্রিপ্ট এবং ফাংশন একে এক্সেস করতে পারে।

kt_satt_skill_example_id=323

স্বয়ংক্রিয়ভাবে গ্লোবাল

যদি আপনি কোন ভ্যারিয়েবলকে ডিক্লেয়ার না করে ভ্যালু এসাইন করেন তাহলে ভ্যারিয়েবলটি সয়ংক্রিয়ভাবে একটি গ্লোবাল ভ্যারিয়েবলে পরিণত হবে।

kt_satt_skill_example_id=324

প্রয়োজন ছাড়া গ্লোবাল ভ্যারিয়েবল তৈরি না করাই উত্তম।

"Strict Mode" এ স্বয়ংক্রিয়ভাবে গ্লোবাল ভ্যারিয়েবলকে এড়িয়ে চলা হয়।

এইচটিএমএলে গ্লোবাল ভ্যারিয়েবল

জাভাস্ক্রিপ্টে গ্লোবাল স্কোপ সম্পূর্ণ জাভাস্ক্রিপ্টকে বুঝায়।

এইচটিএমএলে উইন্ডো অবজেক্ট হচ্ছে গ্লোবাল স্কোপ। সকল গ্লোবাল ভ্যারিয়েবল উইন্ডো অবজেক্টে অন্তর্গত থাকে।

kt_satt_skill_example_id=325

আপনি জানেন কী?

গ্লোবাল ভ্যারিয়েবল(বা ফাংশন) উইন্ডো ভ্যারিয়েবলকে(বা ফাংশন) মুছে ফেলতে পারে।
উইন্ডো অবজেক্টসহ যেকোন ফাংশন, আপনার গ্লোবাল ভ্যারিয়েবল এবং ফাংশনকে মুছে ফেলতে পারে।

জাভাস্ক্রিপ্ট ভ্যারিয়েবলের জীবনকাল

জাভাস্ক্রিপ্ট ভ্যারিয়েবল ডিক্লেয়ার করা হলে এর জীবনকাল শুরু হয়।

ফাংশনের কার্য সম্পন্ন হলে লোকাল ভ্যারিয়েবল মুছে যায়।

ওয়েব পেজ বন্ধ করলে গ্লোবাল ভ্যারিয়েবল মুছে যায়।

ফাংশন আর্গুমেন্ট

ফাংশন আর্গুমেন্ট(প্যারামিটার) ফাংশনের ভিতরে লোকাল ভ্যারিয়েবল হিসেবে কাজ করে।

Content added || updated By

Ibnul Haisan

জাভাস্ক্রিপ্ট অপারেটর (JS Operator)

জাভাস্ক্রিপ্ট অপারেটর(Operator)

kt_satt_skill_example_id=333

জাভাস্ক্রিপ্ট গাণিতিক অপারেটর

সংখ্যার যোগ-বিয়োগ করার জন্য জাভাস্ক্রিপ্টে গাণিতিক অপারেটর ব্যবহার করা হয়ঃ

অপারেটর	বর্ণনা
+	যোগ(Addition)
-	বিয়োগ(Subtraction)
*	গুণ(Multiplication)
/	ভাগ(Division)
%	(ভাগশেষ)Modulus
++	এক করে বৃদ্ধি (Increment)
--	এক করে হ্রাস(Decrement)

যোগ(+) অপারেটর সংখ্যাকে যোগ করেঃ

kt_satt_skill_example_id=335

গুণন(*) অপারেটর সংখ্যাকে গুণ করেঃ

kt_satt_skill_example_id=336

	পরবর্তী অধ্যায়ে জাভাস্ক্রিপ্ট অপারেটর সম্পর্কে আরো অনেক শিখবেন।

জাভাস্ক্রিপ্ট এসাইনমেন্ট অপারেটর

এসাইনমেন্ট অপারেটর জাভাস্ক্রিপ্ট ভ্যারিয়েবলের মধ্যে ভ্যালু এসাইন করে।

অপারেটর	উদাহরণ
=	x = y	x = y
+=	x += y	x = x + y
-=	x -= y	x = x - y
*=	x *= y	x = x * y
/=	x /= y	x = x / y
%=	x %= y	x = x % y

এসাইনমেন্ট অপারেটর(=) জাভাস্ক্রিপ্ট ভ্যারিয়েবলের মধ্যে ভ্যালু জমা রাখে।

kt_satt_skill_example_id=337

যোগ এসাইনমেন্ট(+=) অপারেটর ভ্যারিয়েবলে ভ্যালু যোগ করে।

kt_satt_skill_example_id=339

জাভাস্ক্রিপ্ট স্ট্রিং অপারেটর

স্ট্রিংকে যোগ(concaenate) করতেও + অপারেটর ব্যবহার করতে হয়

	যখন যোগ(+) অপারেটর স্ট্রিং-এ ব্যবহার করা হয় তখন একে কনকাটিনেশন(concatenation) অপারেটর বলা হয়।

kt_satt_skill_example_id=341

+= এসাইনমেন্ট অপারেটর স্ট্রিংকে যোগ করার ক্ষেত্রে ব্যবহার করা হয়ঃ

kt_satt_skill_example_id=342

স্ট্রিং এবং সংখ্যার যোগ

দুটি সংখ্যাকে যোগ করলে যোগফল সংখ্যা হবে কিন্তু একটি সংখ্যা ও একটি স্ট্রিং যোগ করলে যোগফল হবে স্ট্রিংঃ

kt_satt_skill_example_id=346

নিয়মঃ নাম্বার এবং স্ট্রিংকে যোগ করলে যোগফল হবে স্ট্রিং!

জাভাস্ক্রিপ্ট কম্প্যারিজন(Comparison) এবং লজিক্যাল(Logical) অপারেটর

অপারেটর	বর্ণনা
==	সমান
===	সমান মান এবং একই টাইপ
!=	সমান না
!==	একই মান এবং টাইপের না
>	বড়
<	ছোট
>=	বড় অথবা সমান
<=	ছোট অথবা সমান
?	তিনটি অপারেটর নিয়ে গঠিত (if...else এর মতই কাজ করে)

	জেএস কম্প্যারিজন অধ্যায়ে কম্প্যারিজন এবং লজিক্যাল অপারেটর সম্পর্কে সম্পূর্ণ বর্ণনা করা হয়েছে।

জাভাস্ক্রিপ্ট টাইপ অপারেটর

অপারেটর	বর্ণনা
typeof	ভ্যারিয়েবলের টাইপ রিটার্ন করে
instanceof	যদি একটি অবজেক্ট অন্য একটি অবজেক্ট টাইপের হয় তাহলে true রিটার্ন করবে

	জেএস ধরন পরিবর্তন অধ্যায়ে টাইপ অপারেটর সম্পর্কে আলোচনা করা হয়েছে।

Content added By

Ibnul Haisan

জাভাস্ক্রিপ্ট গণিত (JS Arithmetic)

সংখ্যা সচারচর যোগ-বিয়োগ(arithmetic) করার জন্য ব্যবহার করা হয়।

জাভাস্ক্রিপ্ট গাণিতিক অপারেটর(Arithmetic Operator)

সংখ্যা(লিটারাল অথবা ভ্যারিয়েবল) যোগ-বিয়োগ করার জন্য জাভাস্ক্রিপ্টে গাণিতিক অপারেটর ব্যবহার করা হয়।

অপারেটর	বর্ণনা
+	যোগ(Addition)
-	বিয়োগ(Subtraction)
*	গুণ(Multiplication)
/	ভাগ(Division)
%	মডুলাস(Modulus)
++	এক করে বৃদ্ধি (Increment)
--	এক করে হ্রাস(Decrement)

গাণিতিক অপারেটর(Arithmetic Operation)

গাণিতিক অপারেটর সাধারণত দুইটি নাম্বারের হিসাব-নিকাশ করে।

সংখ্যা দুইটি লিটারাল হতে পারেঃ

kt_satt_skill_example_id=349

অথবা ভ্যারিয়েবল হতে পারেঃ

kt_satt_skill_example_id=352

অথবা এক্সপ্রেশন(expression) হতে পারেঃ

kt_satt_skill_example_id=356

অপারেটর এবং অপারেন্ড(Operator and Operand)

গাণিতিক হিসাব-নিকাশে সংখ্যাকে বলা হয় অপারেন্ড।

অপারেটর(operator) দুইটি অপারেন্ডের কার্য নির্ধারন করে।

অপারেন্ড	অপারেটর	অপারেন্ড
100	+	50

যোগ(+) অপারেটর সংখ্যার যোগ করেঃ

kt_satt_skill_example_id=361

বিয়োগ(-) অপারেটর সংখ্যার বিয়োগ করেঃ

kt_satt_skill_example_id=365

গুণ(*) অপারেটর সংখ্যার গুণ করে

kt_satt_skill_example_id=367

ভাগ(/) অপারেটর সংখ্যার ভাগ করেঃ

kt_satt_skill_example_id=369

ভাগশেষ(%) অপারেটরের মাধ্যমে ভাগশেষ পাওয়া যায়।

kt_satt_skill_example_id=371

বৃদ্ধি(++) অপারেটর সংখ্যাকে এক করে বৃদ্ধি করেঃ

kt_satt_skill_example_id=372

হ্রাস(--) অপারেটর সংখ্যার এক করে হ্রাস করেঃ

kt_satt_skill_example_id=374

অপারেটর অগ্রাধিকার

গাণিতিক এক্সপ্রেশনে বিভিন্ন অপারেটর(+, -, *, / % ) তাদের ক্রমানুসারে সংখ্যাকে অপারেট করে।

kt_satt_skill_example_id=376

উপরের উদাহরণের ফলাফল কি 25 * 5 এর মত হবে নাকি 20 + 25 এর মত হবে?

যোগ এবং গুণের মধ্যে কোনটি আগে সংঘটিত হবে?

আমরা স্কুল যেমন গণিতে গুণের কাজ আগে করতাম, এখানেও তেমনি গুণের কাজ আগে হয়েছে।

যোগ(+) এবং বিয়োগ(-) এর তুলনায় গুণ(*) এবং ভাগের(/) অগ্রাধিকার বেশি।

স্কুলের মত এখানেও বন্ধনী(parentheses) ব্যবহার করে অপারেটরের অগ্রাধিকার পরিবর্তন করা যায়।

kt_satt_skill_example_id=380

বন্ধনী ব্যবহার করলে সবার আগে বন্ধনীর কাজ হয়

যখন অনেক অপারেশনের একই অগ্রাধিকার থাকে(যেমন - যোগ এবং বিয়োগ) তখন বাম দিক থেকে অপারেশন শুরু হয়ে ডান দিকে শেষ হয়ঃ

kt_satt_skill_example_id=382

জাভাস্ক্রিপ্ট অপারেটর অগ্রাধিকারের মান

মান	অপারেটর	বর্ণনা	উদাহরণ
১৯	( )	এক্সপ্রেশন শ্রেণীবদ্ধকরণ	(5 + 6)

১৮	.	মেম্বার	person.name
১৮	[]	মেম্বার	person["name"]

১৭	()	ফাংশন কল	myFunction()
১৭	new	তৈরি করে	new Date()

১৬	++	পরে বৃ্দ্ধি করে	i++
16	--	পরে হ্রাস করে	i--

15	++	আগে বৃ্দ্ধি করে	++i
15	--	আগে হ্রাস করে	--i
15	!	লজিক্যাল না বুঝায়	!(x==y)
১৫	typeof	টাইপ	typeof x

১৪	*	গুণ	১০ * ৫
১৪	/	ভাগ	১০ / ৫
14	%	ভাগশেষ	১০ % ৫
14	**	বর্গ করে	10 ** 2

১৩	+	যোগ	১০ + ৫
১৩	-	বিয়োগ	১০ - ৫

১২	<<	বাম দিকে নেয়(Shift left)	x << 2
১২	>>	ডান দিকে নেয়(Shift right)	x >> 2

১১	<	ছোট	x < y
১১	<=	ছোট অথবা সমান	x <= y
11	>	বড়	x > y
11	>=	বড় অথবা সমান	x >= y

১০	==	সমান	x == y
১০	===	একই মান এবং টাইপ	x === y
১০	!=	সমান না	x != y
১০	!==	একই মান এবং টাইপ নয়	x !== y

৬	&&	এবং	x && y
৫	\|\|	অথবা	x \|\| y

৩	=	ভ্যালু জমা রাখা	x = y
৩	+=	ভ্যালু জমা রাখা	x += y
৩	-=	ভ্যালু জমা রাখা	x -= y
৩	*=	ভ্যালু জমা রাখা	x *= y
৩	/=	ভ্যালু জমা রাখা	x /= y

	লাল চিহ্নিত ঘরের অপারেটরটি পরীক্ষামূলক বুঝাতে ব্যবহার করা হয়েছে।

Content added By

Ibnul Haisan

জাভাস্ক্রিপ্ট এসাইনমেন্ট (JS Assignment)

জাভাস্ক্রিপ্ট এসাইনমেন্ট অপারেটর

এসাইনমেন্ট অপারেটর জাভাস্ক্রিপ্ট ভ্যারিয়েবলে ভ্যালু জমা রাখে।

অপারেটর	উদাহরণ	উদাহরণ কলামের মত
=	x = y	x = y
+=	x += y	x = x + y
-=	x -= y	x = x - y
*=	x *= y	x = x * y
/=	x /= y	x = x / y
%=	x %= y	x = x % y

"=" এসাইনমেন্ট অপারেটরটি ভ্যারিয়েবলের মধ্যে মান জমা রাখে।

kt_satt_skill_example_id=387

"+=" এসাইনমেন্ট অপারেটরটি ভ্যারিয়েবলে নতুন মান যোগ করে।

kt_satt_skill_example_id=389

"-=" এসাইনমেন্ট অপারেটরটি ভ্যারিয়েবল থেকে ভ্যালু বিয়োগ করে।

kt_satt_skill_example_id=392

"*=" এসাইনমেন্ট অপারেটরটি ভ্যারিয়েবলকে গুণ করে।

kt_satt_skill_example_id=394

"/=" এসাইনমেন্ট অপারেটরটি ভ্যারিয়েবলকে ভাগ করে।

kt_satt_skill_example_id=397

"%=" এসাইনমেন্ট অপারেটরটি ভাগশেষ জমা রাখে।

kt_satt_skill_example_id=399

Content added By

Ibnul Haisan

জাভাস্ক্রিপ্ট ফাংশন (JS Function)

জাভাস্ক্রিপ্ট ফাংশন হচ্ছে একগুচ্ছ কোড যা কোন নির্দিষ্ট কাজ সম্পাদন করার জন্য তৈরি করা হয়।

জাভাস্ক্রিপ্ট ফাংশন নিজে নিজে সম্পাদিত(execution) হয় না। এটা সম্পাদিত হয় যখন কোন কিছুর মাধ্যমে একে ডাকা হয়।

kt_satt_skill_example_id=402

জাভাস্ক্রিপ্ট ফাংশনের গঠনপ্রণালী(Syntax)

জাভাস্ক্রিপ্ট ফাংশন তৈরি করতে প্রথমে function কিওয়ার্ড(keyword) লিখতে হবে, তারপর ফাংশনের নাম এবং এর ডান পাশে () এবং এর ডানপাশে {} লিখতে হয়।

ফাংশনের নাম সাধারনত অক্ষর(letters),সংখ্যা(digits),আন্ডারস্কোর(_), ডলার($) চিহ্ন দিয়ে লেখা যায়।

প্রথম বন্ধনীর মাঝের প্যারামিটারগুলো কমার(,) মাধ্যমে আলাদা করা হয়ঃ (parameter1, parameter2, ...)

দ্বিতীয় বন্ধনীর {} মধ্যে অবস্থিত কোডগুলো ফাংশনকে কল করার মাধ্যমে সম্পাদিত হয়।

kt_satt_skill_example_id=403

ফাংশন প্যারামিটার(parameter) হচ্ছে ফাংশন ডেফিনেশনের প্রথম বন্ধনীর মধ্যে ব্যবহৃত নাম।

ফাংশন আর্গুমেন্ট(arguments) হচ্ছে ফাংশনকে ডাকার(invoke) সময় প্যারামিটারের মান যেগুলো ফাংশন ব্যবহার করে।

ফাংশনের মধ্যে আর্গুমেন্টগুলো লোকাল ভ্যারিয়েবলের(local variables) মত আচরণ করে।

	জাভাস্ক্রিপ্টের ফাংশনগুলো অন্যান্য প্রোগ্রামিং ল্যাঙ্গুয়েজের প্রসিডিউর(Procedure) অথবা সাব্রুটিনের(Subroutine) মত।

ফাংশন ডাকা(Invocation)

কোন কিছুর মাধ্যমে ফাংশনকে ডাক(Call) দেওয়া হলে ফাংশনের ভিতরের কোডগুলো সম্পাদিত(Execution) হয়ঃ

যখন কোন ইভেন্ট ঘটে (ব্যবহারকারী বাটনে ক্লিক করলে)
যখন একে ডাকা(Call) হয়
স্বয়ংক্রিয়ভাবে (নিজেই নিজেকে কল করে)

এই টিউটোরিয়ালের পরবর্তী পরিচ্ছেদে ফাংশন কল সম্পর্কে আপনি আরো শিখবেন।

ফাংশন রিটার্ন(Return)

জাভাস্ক্রিপ্ট রিটার্ন(return) স্টেটমেন্টের কাছে পৌঁছালে ফাংশন এক্সিকিউশন বন্ধ হয়ে যায়।

যদি ফাংশনকে কোন স্টেটমেন্টে কল করা হয় তাহলে জাভাস্ক্রিপ্ট ঐ স্টেটমেন্টের পরে সেই ফাংশনের কোড করার জন্য ফেরত যায়।

ফাংশন প্রায়ই রিটার্ন(return) ভ্যালু এক্সিকিউট করে। রিটার্নকৃত ভ্যালু কলারের(Caller) কাছে ফেরত পাঠানো হয়ঃ

kt_satt_skill_example_id=404

ফাংশন কেন?

আপনি কোড বারবার ব্যবহার করতে পারবেনঃ কোড একবার লিখে অসংখ্যবার ব্যবহার করতে পারবেন।

ভিন্ন ভিন্ন ফলাফল পাওয়ার জন্য আপনি বিভিন্ন আর্গুমেন্ট ব্যবহার করে একই কোড অনেকবার ব্যবহার করতে পারেন।

kt_satt_skill_example_id=405

() অপারেটর ফাংশনকে কল করে

উপরোক্ত উদাহরনে ব্যবহৃত toCelsius দ্বারা ফাংশন অবজেক্টকে বুঝা‍য় এবং toCelsius() দ্বারা ফাংশনের ফলাফলকে বুঝায়।

kt_satt_skill_example_id=407

ফাংশনকে ভ্যারিয়েবল হিসেবে ব্যবহার

জাভাস্ক্রিপ্টে আপনি ফাংশনকে ভ্যারিয়েবলের মত ব্যবহার করতে পারেন।

kt_satt_skill_example_id=409

একটি ফাংশনের রিটার্ন ভ্যালু একটি ভ্যারিয়েবলে জমা না রেখেঃ

আপনি ফাংশনকে সরাসরি ভ্যারিয়েবলের মত ব্যবহার করতে পারেনঃ

kt_satt_skill_example_id=410

Note এই টিউটোরিয়ালের পরবর্তী পরিচ্ছেদে আপনি ফাংশন সম্পর্কে আরো শিখবেন।

Content added By

Ibnul Haisan

জাভাস্ক্রিপ্ট অবজেক্ট (JS Object)

বাস্তব জীবনের অবজেক্ট, প্রোপার্টি, এবং মেথড

বাস্তব জীবনে, একটি গাড়ি হল অবজেক্ট। একটি গাড়ির ওজন এবং রং প্রোপার্টি, মেথড হচ্ছে গাড়ি চালু করা বা বন্ধ করাঃ

অবজেক্ট	প্রোপার্টি	মেথড
	car.name = Lamborghini car.model = 500 car.weight = 850kg car.color = white	car.start() car.drive() car.brake() car.stop()

সব গাড়ির একই ধরনের প্রোপার্টি থাকে, কিন্তু বিভিন্ন গাড়ির বিভিন্ন ধরনের প্রোপার্টি ভ্যালু থাকে।

সব গাড়ির একই ধরনের মেথড থাকে, কিন্তু মেথডগুলো বিভিন্ন সময়ে সম্পাদন হয়।

জাভাস্ক্রিপ্ট অবজেক্ট

আপনারা ইতিমধ্যে জেনেছেন যে, জাভাস্ক্রিপ্ট ভ্যারিয়েবলগুলো হলো ডাটার কন্টেইনার বা পাত্র।

এই কোডে car নামের একটি ভ্যারিয়েবলে একটি সাধারণ ভ্যালু এসাইন করা হয়েছেঃ

kt_satt_skill_example_id=427

অবজেক্টও এক ধরনের ভ্যারিয়েবল। কিন্তু অবজেক্ট এক সাথে অনেক ভ্যালু ধারন করতে পারে।

এই কোডে member নামের ভ্যারিয়েবলে একসাথে অনেক ভ্যালু(Azizur, Rahman, 32, black) এসাইন করা হয়েছেঃ

kt_satt_skill_example_id=428

ভ্যালুগুলো name:value আকারে জোড়ায় জোড়ায় লিখা হয়েছে (name and value কোলন দ্বারা আলাদা করা হয়েছে)।

জাভাস্ক্রিপ্ট অবজেক্ট নামযুক্ত ভ্যালু(eyeColor:"black") ধারন করে।

অবজেক্ট প্রোপার্টি

name:value এর জোড়াকে জাভাস্ক্রিপ্ট অবজেক্টে প্রোপার্টি বলা হয়।

kt_satt_skill_example_id=429

প্রোপার্টি	প্রোপার্টি ভ্যালু
firstName	Azizur
lastName	Rahman
age	50
eyeColor	black

অবজেক্ট মেথড

অবজেক্টের উপর সম্পাদিত কাজকেই মেথড বলে।

মেথডকে ফাংশন ডেফিনেশন আকারে প্রোপার্টির মধ্যে জমা রাখতে হয়।

প্রোপার্টি	প্রোপার্টি ভ্যালু
firstName	Azizur
lastName	Rahman
age	50
eyeColor	black
fullName	function() {return this.firstName + " " + this.lastName;}

জাভাস্ক্রিপ্ট অবজেক্ট হলো প্রোপার্টি এবং মেথডের কন্টেইনার।

অবজেক্টের সংজ্ঞা

অবজেক্ট লিটারালের(object literal) মাধ্যমে আপনি একটি জাভাস্ক্রিপ্ট অবজেক্ট তৈরি করতে পারেনঃ

kt_satt_skill_example_id=432

অবজেক্ট ডেফিনেশনে স্পেস এবং লাইন ব্রেক(line break) গুরুত্বপূর্ণ নয়। একটি অবজেক্ট ডেফিনেশনকে একাধিক লাইনে লেখা যেতে পারেঃ

kt_satt_skill_example_id=432

অবজেক্টের প্রোপার্টি এক্সেস

আপনি দুইভাবে অবজেক্টের প্রোপার্টিকে এক্সেস করতে পারেনঃ

kt_satt_skill_example_id=435

অথবা

kt_satt_skill_example_id=439

kt_satt_skill_example_id=442

kt_satt_skill_example_id=444

অবজেক্টের মেথড এক্সেস

আপনি নিম্নলিখিত পদ্ধতিতে অবজেক্টের মেথডকে এক্সেস করতে পারবেনঃ

kt_satt_skill_example_id=446

kt_satt_skill_example_id=449

যদি আপনি fullName মেথডকে () ছাড়া এক্সেস করতে চান তবে এটি আপনাকে ফাংশন ডেফিনেশনকে হুবুহু রিটার্ন করবেঃ

kt_satt_skill_example_id=452

একটি প্রোপার্টির ভ্যালু হিসেবে যখন ফাংশন ডেফিনেশন রাখা হয় তখন ঐ প্রোপার্টিকে মেথড বলা হয়।

কখনোই Strings, Numbers, এবং Booleans কে অবজেক্ট হিসেবে ডিক্লেয়ার করা উচিত না!

জাভাস্ক্রিপ্টে একটি ভ্যারিয়েবলকে "new" কিওয়ার্ড দ্বারা ডিক্লেয়ার করলে ঐ ভ্যারিয়েবলটি একটি অবজেক্ট হয়ে যায়ঃ

kt_satt_skill_example_id=454

String, Number এবং Boolean অবজেক্ট তৈরি করা থেকে বিরত থাকুন। এইগুলো আপনার কোডকে জটিল এবং সম্পাদনের গতি কমিয়ে দেয়।

আপনি এই টিউটোরিয়ালের পরবর্তী পরিচ্ছেদে অবজেক্ট সম্পর্কে আরো জানতে পারবেন।

Content added || updated By

Ibnul Haisan

জাভাস্ক্রিপ্ট ইভেন্ট (JS Event)

এইচটিএমএল এলিমেন্টে ঘটে এমন সকল কিছুকেই ইভেন্ট বলা হয়।

এইচটিএমএল পেজে জাভাস্ক্রিপ্ট ব্যবহার করা হলে জাভাস্ক্রিপ্ট ঐ সকল ইভেন্টে "প্রতিক্রিয়া" করতে পারে।

এইচটিএমএল ইভেন্ট

ব্রাউজার অথবা ইউজার যা কিছু করে তা এইচটিএমএল ইভেন্ট হতে পারে।

এখানে এইচটিএমএল ইভেন্টের কিছু উদাহরণ দেওয়া হলঃ

একটি এইচটিএমএল ওয়েব পেজ লোডিং সম্পন্ন হওয়া
একটি এইচটিএমএল ইনপুট ফিল্ড পরিবর্তন করা
একটি এইচটিএমএল বাটনে ক্লিক করা

কোন ইভেন্ট ঘটলে আপনি চাইবেন কিছু ঘটুক।

কোন ইভেন্ট ঘটলে জাভাস্ক্রিপ্ট আপনাকে কোড সম্পাদন করতে সহায়তা করবে।

এইচটিএমএল আমাদেরকে জাভাস্ক্রিপ্ট কোডের মাধ্যমে এইচটিএমএল এলিমেন্টে ইভেন্ট হ্যান্ডেলার এট্রিবিউট যোগ করতে সাহায্য করে।

সিঙ্গেল কোটেশন দিয়েঃ

kt_satt_skill_example_id=466

ডাবল কোটেশন দিয়েঃ

kt_satt_skill_example_id=467

নিচের উদাহরণে, একটি বাটন এলিমেন্টে onclick এট্রিবিউট যোগ করে দেখানো হলোঃ

kt_satt_skill_example_id=469

উপরের উদাহরণে, জাভাস্ক্রিপ্ট কোড id="test" যুক্ত এলিমেন্টের কন্টেন্টকে পরিবর্তন করেছে।

পরবর্তী উদাহরণে, কোড(this.innerHTML ব্যবহার করে) নিজ এলিমেন্টের কন্টেন্টকে পরিবর্তন করবেঃ

kt_satt_skill_example_id=471

জাভাস্ক্রিপ্ট কোড বেশিরভাগ ক্ষেত্রে কয়েক লাইন দীর্ঘ হতে পারে। তাই ইভেন্ট এট্রিবিউটে ফাংশনকে কল করা যায়ঃ

kt_satt_skill_example_id=475

এইচটিএমএল ইভেন্ট

এখানে কিছু এইচটিএমএল ইভেন্টের তালিকা দেয়া হলোঃ

ইভেন্ট	বিবরণ
onchange	একটি এইচটিএমএল এলিমেন্ট পরিবর্তন করা হয়েছে
onclick	ব্যবহারকারী একটি এইচটিএমএল এলিমেন্ট ক্লিক করেছে
onmouseover	ব্যবহারকারী একটি এইচটিএমএল এলিমেন্টের উপরে মাউস নিয়েছে
onmouseout	ব্যবহারকারী একটি এইচটিএমএল এলিমেন্টের উপর থেকে মাউস সরিয়ে নিলে
onkeydown	ব্যবহারকারী একটি কীবোর্ড কী চাপলে
onload	ব্রাউজার পেজ লোড সম্পন্ন করলে

তালিকাটি অনেক বড়। আমাদের জাভাস্ক্রিপ্ট রেফারেন্স এইচটিএমএল ডোম ইভেন্ট দেখুন।

জাভাস্ক্রিপ্ট কি করতে পারে?

ইভেন্ট হ্যান্ডেলার নিয়ন্ত্রণ, যাচাই, ইউজার ইনপুট, ব্যবহারকারীর কোন কাজ এবং ব্রাউজারের ক্রিয়ার ব্যবহার করতে পারেনঃ

প্রতিবার পেজ লোড হলে কিছু কাজ সম্পাদন হবে
পেজ বন্ধ করলে কিছু কাজ সম্পাদন হবে
ব্যবহারকারী একটি বাটনে ক্লিক করলে কিছু কাজ ঘটবে
ব্যবহারকারী কোন ডাটা প্রদান করবে তখন কন্টেন্টগুলোকে যাচাই করা হবে এবং আরো...

ইভেন্টের কার্য সম্পাদনে জাভাস্ক্রিপ্টে বিভিন্ন ধরনের পদ্ধতি রয়েছেঃ

এইচটিএমএল ইভেন্ট এট্রিবিউট জাভাস্ক্রিপ্টের কোড সরাসরি এক্সিকিউট করতে পারে
এইচটিএমএল ইভেন্ট এট্রিবিউট জাভাস্ক্রিপ্টের ফাংশনকে কল করতে পারে
এইচটিএমএল এলিমেন্টে আপনার নিজস্ব ইভেন্ট হ্যান্ডেলার ফাংশনকে এসাইন করতে পারেন।
ইভেন্টকে আপনি প্রতিরোধ বা পরিচালিত করা থেকে বিরত রাখতে পারেন এবং আরো...

এইচটিএমএল ডোম পরিচ্ছেদে ইভেন্ট এবং ইভেন্ট হ্যান্ডলার সম্পর্কে আরো বিস্তারিত জানতে পারবেন।

Content added By

Ibnul Haisan

জাভাস্ক্রিপ্ট সেট (JS Set)

Please, contribute to add content into জাভাস্ক্রিপ্ট সেট (JS Set).

Content

জাভাস্ক্রিপ্ট ম্যাপ (JS Map)

Please, contribute to add content into জাভাস্ক্রিপ্ট ম্যাপ (JS Map).

Content

জাভাস্ক্রিপ্ট টাইপঅফ (JS typeof)

Please, contribute to add content into জাভাস্ক্রিপ্ট টাইপঅফ (JS typeof).

Content

জাভাস্ক্রিপ্ট টাইপ পরিবর্তন (JS Type Conversion)

Number() মেথড নম্বরে, String() মেথড স্ট্রিং-এ, Boolean() মেথড বুলিয়ানে রুপান্তর করে।

জাভাস্ক্রিপ্ট ডাটা টাইপ

জাভাস্ক্রিপ্টে ৫ ধরনের ডাটা টাইপ রয়েছে যাদের মধ্যে ভ্যালু থাকেঃ

string
number
boolean
object
function

অবজেক্ট ৩ ধরনের হয়ঃ

Object
Date
Array

এবং 2 ধরনের ডাটা টাইপ রয়েছে যাদের ভ্যালু নেইঃ

Null
Undefined

typeof অপারেটর

জাভাস্ক্রিপ্ট ভ্যারিয়েবলের ডাটা টাইপ পাওয়ার জন্য typeof অপারেটর ব্যবহার করা হয়।

kt_satt_skill_example_id=490

লক্ষ্য করুনঃ

NaN এর ডাটা টাইপ হলো number
array এর ডাটা টাইপ হলো object
date এর ডাটা টাইপ হলো object
null এর ডাটা টাইপ হলো object
একটি আনডিফাইন্ড ভ্যারিয়েবলের ডাটা টাইপ হলো undefined*
ভ্যালু এসাইন করা হয়নি এমন ভ্যারিয়েবলের ডাটা টাইপ হলো undefined*

একটি জাভাস্ক্রিপ্ট অবজেক্ট অ্যারে অথবা তারিখ কিনা যাচাই করার জন্য আপনি typeof অপারেটর ব্যবহার করতে পারবেন না।

typeof এর ডাটা টাইপ

typeof অপারেটর ভ্যারিয়েবল নয়। ইহা একটি অপারেটর। অপারেটরের ( + - * /) কোনো ডাটা টাইপ থাকে না।

কিন্তু, typeof অপারেটর অপারেন্ডের টাইপ ধারন করে সবসময় একটি স্ট্রিং রিটার্ন করে।

constructor প্রোপার্টি

constructor প্রোপার্টি সকল জাভাস্ক্রিপ্ট ভ্যারিয়েবলের কন্সট্রাক্টর ফাংশন রিটার্ন করে।

kt_satt_skill_example_id=494

একটি অবজেক্ট অ্যারে(তার মধ্যে "Array" শব্দটি আছে কিনা) কিনা যাচাই করার জন্য আপনি constructor প্রোপার্টি ব্যবহার করতে পারেনঃ

kt_satt_skill_example_id=495

একটি অবজেক্ট Date(তার মধ্যে "Date" শব্দটি আছে কিনা) কিনা যাচাই করার জন্য আপনি constructor প্রোপার্টি ব্যবহার করতে পারেনঃ

kt_satt_skill_example_id=497

জাভাস্ক্রিপ্ট টাইপ কনভার্সন

জাভাস্ক্রিপ্ট ভ্যারিয়েবলকে একটি নতুন ভ্যারিয়েবল এবং অন্য ডাটা টাইপে রূপান্তরিত যায়ঃ

একটি জাভাস্ক্রিপ্ট ফাংশন ব্যবহার করে
স্বয়ংক্রিয়ভাবে জাভাস্ক্রিপ্টের মাধ্যমে

নম্বরকে স্ট্রিং-এ রূপান্তর

String() গ্লোবাল মেথডটি নম্বরকে স্ট্রিং-এ রূপান্তরিত করে।

এতে যেকোন ধরনের নম্বর, লিটারাল, ভ্যারিয়েবল বা এক্সপ্রেশন ব্যবহার করা যাবেঃ

kt_satt_skill_example_id=501

Number মেথডের toString() একই কাজ করে।

kt_satt_skill_example_id=502

আমাদের Number মেথড পরিচ্ছেদে আরো অনেক মেথড পাবেন।

বুলিয়ানকে স্ট্রিং-এ রূপান্তর

String() গ্লোবাল মেথডটি বুলিয়ানকে স্ট্রিং-এ রুপান্তরিত করে।

kt_satt_skill_example_id=503

toString() বুলিয়ান মেথডও একই কাজ করে।

kt_satt_skill_example_id=506

তারিখকে স্ট্রিং-এ রূপান্তর

String() গ্লোবাল মেথডটি তারিখকে স্ট্রিং-এ রুপান্তর করে।

kt_satt_skill_example_id=509

toString() Date মেথডও একই কাজ করে।

kt_satt_skill_example_id=511

আমাদের Date মেথড পরিচ্ছেদে আরো অনেক মেথড পাবেন।

স্ট্রিংকে নম্বরে রূপান্তর

Number() গ্লোবাল মেথডটি নম্বরকে স্ট্রিং-এ রুপান্তর করে।

স্ট্রিং নম্বর("3.14") নম্বরে(3.14) রুপান্তর হয়।

এম্পটি স্ট্রিং 0 তে রুপান্তরিত হয়।

অন্য সবকিছু NaN হবে।

kt_satt_skill_example_id=513

আমাদের Number মেথড পরিচ্ছেদে আপনি আরো মেথড পাবেন।

ইউনারী + অপারেটর

ইউনারী + অপারেটর একটি ভ্যারিয়েবলকে নম্বরে রুপান্তর করতে ব্যবহার করা যাবেঃ

kt_satt_skill_example_id=515

যদি ভ্যারিয়েবলকে রুপান্তর করা না যায় তারপরও এর টাইপ number এ রুপান্তরিত হয়, যার ভ্যালু NaN হবেঃ

kt_satt_skill_example_id=516

বুলিয়ানকে নম্বরে রূপান্তর

Number() গ্লোবাল মেথডটি বুলিয়ানকে নম্বরে রুপান্তর করে।

kt_satt_skill_example_id=517

তারিখকে নম্বরে রূপান্তর

Number() গ্লোবাল মেথডটি তারিখকে নম্বরে রুপান্তর করেঃ

kt_satt_skill_example_id=518

getTime() date মেথডও একই কাজ করে।

kt_satt_skill_example_id=519

স্বয়ংক্রিয় টাইপ কনভার্সন

যখন জাভাস্ক্রিপ্ট একটি "ভুল" ডাটা টাইপ নিয়ে কাজ করে, তখন এটি "সঠিক" টাইপের ভ্যালুতে রূপান্তর করতে চেষ্টা করে।

ফলাফল এমন হতে পারেঃ

kt_satt_skill_example_id=520

স্বয়ংক্রিয় স্ট্রিং কনভার্সন

আপনি একটি অবজেক্ট অথবা ভ্যারিয়েবলের আউটপুট নিতে চাইলে জাভাস্ক্রিপ্ট স্বয়ংক্রিয়ভাবে ভ্যারিয়েবলের toString() ফাংশনকে কল করেঃ

kt_satt_skill_example_id=522

নম্বর এবং বুলিয়ানের ক্ষেত্রেও একই রকম ঘটেঃ

kt_satt_skill_example_id=524

জাভাস্ক্রিপ্ট টাইপ কনভার্সন টেবিল

নিম্নোক্ত টেবিলে জাভাস্ক্রিপ্টের বিভিন্ন ভ্যালুকে নম্বর, স্ট্রিং, এবং বুলিয়ানে রুপান্তর করে দেখানো হয়েছেঃ

প্রকৃত মান	নম্বরে রুপান্তর	স্ট্রিং-এ রুপান্তর	বুলিয়ানে রুপান্তর
false	0	"false"	false
true	1	"true"	true
0	0	"0"	false
1	1	"1"	true
"0"	0	"0"	true
"1"	1	"1"	true
NaN	NaN	"NaN"	false
Infinity	Infinity	"Infinity"	true
-Infinity	-Infinity	"-Infinity"	true
""	0	""	false
"20"	20	"20"	true
"twenty"	NaN	"twenty"	true
[ ]	0	""	true
[20]	20	"20"	true
[10,20]	NaN	"10,20"	true
["twenty"]	NaN	"twenty"	true
["ten","twenty"]	NaN	"ten,twenty"	true
function(){}	NaN	"function(){}"	true
{ }	NaN	"[object Object]"	true
null	0	"null"	false
undefined	NaN	"undefined"	false

কোটেশনের ভ্যালুগুলো স্ট্রিং ভ্যালু নির্দেশ করে।

লাল রংয়ের ভ্যালু দ্বারা বুঝানো হয়েছে প্রোগ্রামাররা এই ভ্যালু প্রত্যাশা করে না।

Content added By

Ibnul Haisan

জাভাস্ক্রিপ্ট বিটওয়াইজ (JS Bitwise)

Please, contribute to add content into জাভাস্ক্রিপ্ট বিটওয়াইজ (JS Bitwise).

Content

জাভাস্ক্রিপ্ট রেগুলার এক্সপ্রেশন (JS RegExp)

রেগুলার এক্সপ্রেশন হচ্ছে কিছু ক্যারেক্টারের ধারা যা একটি সার্চ প্যাটার্ন তৈরি করে।

সার্চ প্যাটার্নটি টেক্সট খোজার জন্য এবং টেক্সট প্রতিস্থাপনের জন্য ব্যবহার করা যায়।

রেগুলার এক্সপ্রেশন বলতে কী বোঝায়?

টেক্সটের মধ্যে ডাটা খোজার সময় আপনি এই সার্চ প্যাটার্নের মাধ্যমে বলে দিতে পারেন কি পেতে চাইছেন।

রেগুলার এক্সপ্রেশন একটি ক্যারেক্টার অথবা আরো জটিল প্যাটার্নের হতে পারে।

গঠনপ্রণালী

kt_satt_skill_example_id=537

kt_satt_skill_example_id=539

উদাহরণের ব্যাখ্যাঃ

/sattacademy/i একটি রেগুলার এক্সপ্রেশন।

sattacademy একটি প্যাটার্ন।(একটি অনুসন্ধান ব্যবহার করা হবে)

i একটি মডিফায়ার(যা সার্চকে কেস ইনসেন্সিটিভ হবে নির্দেশ করে)।

স্ট্রিং মেথডের ব্যবহার

জাভাস্ক্রিপ্টে রেগুলার এক্সপ্রেশন দুটি স্ট্রিং মেথড দ্বারা ব্যবহার করা হয়ঃ search() এবং replace() মেথড।

search() মেথড মিল খোজার জন্য এক্সপ্রেশন ব্যবহার করে এবং এর অবস্থান রিটার্ন করে।

replace() মেথড পরিবর্তিত স্ট্রিংকে রিটার্ন করে।

search() মেথডে রেগুলার এক্সপ্রেশনের ব্যবহার

kt_satt_skill_example_id=543

search() মেথডে স্ট্রিং-এর ব্যবহার

search মেথড আর্গুমেন্ট হিসাবে একটি স্ট্রিং গ্রহণ করে। স্ট্রিং আর্গুমেন্ট একটি রেগুলার এক্সপ্রেশনে রূপান্তরিত হবেঃ

kt_satt_skill_example_id=545

replace() মেথডে রেগুলার এক্সপ্রেশনের ব্যবহার

kt_satt_skill_example_id=548

replace() মেথডে স্ট্রিং-এর ব্যবহার

replace() মেথড আর্গুমেন্ট হিসেবে একটি স্ট্রিংও গ্রহণ করেঃ

kt_satt_skill_example_id=551

লক্ষণীয় বিষয়

উপরের মেথডগুলোতে আর্গুমেন্ট হিসেবে রেগুলার এক্সপ্রেশন ব্যবহার করা যায়।
রেগুলার এক্সপ্রেশনের ব্যবহার আপনার অনুসন্ধান অনেক বেশি শক্তিশালী করতে পারে।

রেগুলার এক্সপ্রেশন মডিফায়ার

মডিফায়ার	বর্ণনা
i	অনুসন্ধান কেস-ইনসেন্সিটিভ হবে
g	সম্পূর্ন মিলকে খুজে বের করবে
m	একাধিক লাইনের মিল খুঁজে বের করে

রেগুলার এক্সপ্রেশন প্যাটার্ন

এক্সপ্রেশন	বর্ণনা
[abc]	ব্র্যাকেটের মাঝের যেকোনো অক্ষর খুজে বের করে
[0-9]	ব্র্যাকেটের মাঝের যেকোনো সংখ্যা খুজে বের করে
(x\|y)	\| দ্বারা বিভক্ত দুইটির যেকোন একটি খুজে বের করে

মেটা-ক্যারেক্টার বিশেষ অর্থ সম্বলিত কিছু ক্যারেক্টারঃ

মেটা-ক্যারেক্টার	বর্ণনা
\d	একটি সংখ্যা খুজে বের করে
\s	একটি সাদা স্পেস অক্ষর খুজে বের করে
\b	একটি শব্দের শুরু অথবা শেষে মিল খুজে বের করে
\uxxxx	হেক্সাডেসিমেল xxxx নম্বর দ্বারা নির্দেশিত ইউনিকোড ক্যারেক্টার খুজে বের করে

কোয়ান্টিফায়ার বিদ্যমানতা বুঝায়ঃ

কোয়ান্টিফায়ার	বর্ণনা
n+	যেসকল স্ট্রিং-এ অন্তত একটি n রয়েছে তাদেরকে খুজে বের করে
n*	যেসকল স্ট্রিং-এ শূন্য অথবা একের অধিক n রয়েছে তাদের খুজে বের করে
n?	যেসকল স্ট্রিং-এ শূন্য অথবা একটি n রয়েছে তাদের খুজে বের করে

রেগুলার এক্সপ্রেশন অবজেক্ট ব্যবহার

জাভাস্ক্রিপ্টে রেগুলার এক্সপ্রেশন অবজেক্ট হলো পূর্বনির্ধারিত প্রোপার্টি ও মেথডসহ একটি অবজেক্ট।

test() মেথডের ব্যবহার

test() মেথড হচ্ছে রেগুলার এক্সপ্রেশনের একটি মেথড।

ইহা একটি স্ট্রিং-এর মধ্যে একটি নমুনা/প্যাটার্ন খোজে,যদি খুজে পায় তাহলে true রিটার্ন করে,না পেলে false রিটার্ন করে।

নিম্নলিখিত উদাহরণটিতে একটি স্ট্রিং-এ "a" অক্ষরটি খুজে বের করবেঃ

kt_satt_skill_example_id=555

যেহেতু উপরের স্ট্রিং-এ "e" রয়েছে, সেহেতু ফলাফল হবেঃ

kt_satt_skill_example_id=557

kt_satt_skill_example_id=560

exec() ব্যবহার

exec() মেথড একটি রেগুলার এক্সপ্রেশন মেথড।

ইহা একটি স্ট্রিং-এর মধ্যে নির্দিষ্টা নমুনা/প্যাটার্ন খোজে,যদি খুজে পায় তাহলে ঐ টেক্সটটি রিটার্ন করবে। যদি না পাওয়া যায় তবে null রিটার্ন করবে।

নিম্নলিখিত উদাহরণটিতে একটি স্ট্রিং-এ "a" অক্ষরটি খুজে বের করবেঃ

kt_satt_skill_example_id=571

যেহেতু উপরের স্ট্রিং-এ "a" রয়েছে, সেহেতু ফলাফল হবেঃ

kt_satt_skill_example_id=562

kt_satt_skill_example_id=566

সম্পূর্ণ রেগুলার এক্সপ্রেশন রেফারেন্স

সম্পূর্ণ রেফারেন্সের জন্য আমাদের জাভাস্ক্রিপ্ট রেগুলার এক্সপ্রেশন রেফারেন্স পড়ুন। রেফারেন্সে সকল রেগুলার এক্সপ্রেশন প্রোপার্টি মেথড এর উদাহরণ এবং বর্ণনা রয়েছে।

Content added || updated By

Ibnul Haisan

জাভাস্ক্রিপ্ট অপারেটর অগ্রাধিকার (JS Operator Precedence)

Please, contribute to add content into জাভাস্ক্রিপ্ট অপারেটর অগ্রাধিকার (JS Operator Precedence).

Content

জাভাস্ক্রিপ্ট ত্রুটি (JS Error)

try স্টেটমেন্ট এঁররের জন্য একটি কোড ব্লককে টেস্ট করতে সাহায্য করে

catch স্টেটমেন্ট আপনাকে এঁরর নিয়ন্ত্রণ করতে সাহায্য করে

throw স্টেটমেন্ট আপনাকে কাস্টম এঁরর তৈরি করতে সাহায্য করে

finally স্টেটমেন্ট আপনাকে try এবং catch-এর ফলাফল অনুযায়ী কোড এক্সিকিউট করতে দেয়

এঁরর!

জাভস্ক্রিপ্ট কোড এক্সিকিউশনের সময় বিভিন্ন ধরনের এঁরর ঘটে।

প্রোগ্রামার দ্বারা কোড এঁরর, ভুল ইনপুট অথবা অন্যান্য যেকোন কারণে এঁরর ঘটতে পারে।

kt_satt_skill_example_id=581

catch ব্লক newalert কে error হিসেবে ধরবে এবং হ্যান্ডেল করতে কোড এক্সিকিউট করবে।

জাভাস্ক্রিপ্টে try এবং catch

এক্সিকিউশনের সময় try স্টেটমেন্ট একটি কোডের ব্লককে এঁররের জন্য টেস্ট করতে সাহায্য করে।

যদি try ব্লকে কোন এঁরর ঘটে তাহলে catch স্টেটমেন্ট একটি কোডের ব্লককে এক্সিকিউট করতে সাহায্য করে।

জাভাস্ক্রিপ্ট try এবং catch স্টেটমেন্টের গঠনপ্রণালীঃ

kt_satt_skill_example_id=582

throw স্টেটমেন্ট

throw স্টেটমেন্ট একটি কাস্টম এঁরর তৈরি করতে সাহায্য করে।

এর মানে হচ্ছে আপনি একটি এক্সসেপ্সন তৈরি করতে পারেন।

আপনি try এবং catch এর সাথে throw একত্রে ব্যবহার করলে আপনি একটি

ইহা একটি স্ট্রিং, নম্বর, বুলিয়ান অথবা একটি অবজেক্ট হতে পারেঃ

kt_satt_skill_example_id=583

ইনপুট ভ্যালিডেশন

এই উদাহরণে try এবং catch এর সাথে throw এর ব্যবহার দেখানো হয়েছেঃ

kt_satt_skill_example_id=587

এইচটিএমএল ভ্যালিডেশন

আধুনিক ব্রাউজারে জাভাস্ক্রিপ্ট এবং এইচটিএমএল এট্রিবিউট ব্যবহার করে ভ্যালিডেশন করা হয়ঃ

kt_satt_skill_example_id=593

এই টিউটোরিয়ালের পরবর্তী পরিচ্ছেদে ফর্ম ভ্যালিডেশন সম্পর্কে আরো জানবেন।

finally স্টেটমেন্ট

finally স্টেটমেন্ট আপনাকে try এবং catch-এর ফলাফলের উপর নির্ভর করে কোড এক্সিকিউট করতে সাহায্য করেঃ

kt_satt_skill_example_id=598

কোড ডিবাগিং

প্রোগ্রামিং কোডের এঁরর খোঁজাকে কোড ডিবাগিং বলে।

যখন কোডের মধ্যে এঁরর হবে,আপনি কোন এঁরর মেসেজ পাবেন না। আপনি বুঝতে পারবেন না কোথায় ভুলের জন্য অনুসন্ধান করবেন।

জাভাস্ক্রিপ্ট ডিবাগার

ডিবাগ করা সহজ নয়। কিন্তু বর্তমানে সকল আধুনিক ব্রাউজারে একটি বিল্ট-ইন ডিবাগার আছে।

ডিবাগারে ব্রেকপয়েন্ট সেট করে আপনি এক্সিকিউশনের সময় ভ্যারিয়েবলের ভ্যালু দেখতে পারেন।

আপনি F12 কী চেপে আপনার ব্রাউজারে ডিবাগিং মেন্যু থেকে কনসোল চালু করতে পারেন।

console.log()

console.log() মেথড ব্যবহার করে আপনি আপনার কোডের বিভিন্ন ভ্যালু দেখতে পারবেনঃ

kt_satt_skill_example_id=600

ব্রেকপয়েন্ট সেট করা

ডিবাগার উইন্ডোতে জাভাস্ক্রিপ্টের কোডের মধ্যে আপনি ব্রেকপয়েন্ট সেট করতে পারবেন। ব্রেকপয়েন্টে জাভাস্ক্রিপ্ট এক্সিকিউশন বন্ধ করে আপনাকে জাভাস্ক্রিপ্টের ভ্যালু পরীক্ষা করতে সাহায্য করবে।

ভ্যালু পরীক্ষা করার পর আপনি আবার প্লে বাটনে ক্লিক করে কোডের এক্সিকিউশন চালু করতে পারবেন।

Content added By

Ibnul Haisan

জাভাস্ক্রিপ্ট হয়েস্টিং (JS Hoisting)

জাভাস্ক্রিপ্টের একটি ডিফল্ট আচরণ হচ্ছে হয়েস্টিং।

জাভাস্ক্রিপ্টে, একটি ভ্যারিয়েবলকে ডিক্লেয়ার করার পূর্বে ব্যবহার করা যায়।

নিচের দুইটি উদাহরণ একই ফলাফল দেখাবেঃ

kt_satt_skill_example_id=609

kt_satt_skill_example_id=612

এটা বুঝার জন্য আপনাকে হয়েস্টিং("hoisting") বিষয়টি বুঝতে হবে।

জাভাস্ক্রিপ্ট ডিফল্টভাবে সকল ডিক্লেয়ারেশনকে তার নিজ নিজ স্কোপের উপরে নিয়ে যায়,একেই হয়েস্টিং বলা হয়।

ইনিশিয়ালাইজেশন হয়েস্টিং-এর অন্তর্ভুক্ত নয়

জাভাস্ক্রিপ্টে হয়েস্টিং শুধুমাত্র ডিক্লেয়ারেশনের জন্য প্রযোজ্য। ইনিশিয়ালাইজেশন হয়েস্টিং-এর অন্তর্ভুক্ত নয়।

নিচের দুইটি উদাহরণ দেখিঃ

kt_satt_skill_example_id=614

kt_satt_skill_example_id=617

দ্বিতীয় উদাহরণে b এর ভ্যালু undefined দেখিয়েছে। কারণ জাভাস্ক্রিপ্ট শুধুমাত্র ডিক্লেয়ারেশনকে উপরে নিয়েছে, এসাইনকৃত ভ্যালুকে উপরে নেয়নি। তাই b এর ভ্যালু undefined দেখানো হয়েছে।

দ্বিতীয় উদাহরণটি নিচের উদাহরণের মতইঃ

kt_satt_skill_example_id=619

সবসময় ভ্যারিয়েবলকে স্কোপের উপরে ডিক্লেয়ার করা একটি ভাল অভ্যাস।

"use strict";

জাভাস্ক্রিপ্ট কোডে "use strict"; ব্যবহার একটি ভালো দিক। ইহা প্রোগ্রামারদের সিন্টেক্সগত ভুল, অনিচ্ছাকৃত গ্লোবাল ভ্যারিয়েবল তৈরি এবং অন্যান্য সমস্যা থেকে রক্ষা করে। এই বিষয়গুলো জাভাস্ক্রিপ্টে কোন এঁরর দেখায় না, কিন্তু "use strict"; ব্যবহার করলে ইহা এঁরর হিসেবে গণ্য হয়।

একটি স্ক্রিপ্ট এবং প্রতিটি ফাংশনের শুরুতে "use strict"; ডিক্লেয়ার করা যায়।

kt_satt_skill_example_id=622

kt_satt_skill_example_id=623

"use strict"; যদি স্ক্রিপ্টের শুরুতে ব্যবহার করা হয় তবে ইহা স্ক্রিপ্টের সকল কোডের জন্য প্রযোজ্য হবে এবং ফাংশনের ভিতরে ব্যবহার করা হলে ইহা শুধুমাত্র ফাংশনের কোডের জন্য প্রযোজ্য।

Content added By

Ibnul Haisan

জাভাস্ক্রিপ্ট ইউজ স্ট্রিক্ট (JS Use Strict)

Please, contribute to add content into জাভাস্ক্রিপ্ট ইউজ স্ট্রিক্ট (JS Use Strict).

Content

জাভাস্ক্রিপ্ট দিস কিওয়ার্ড (JS this Keyword)

Please, contribute to add content into জাভাস্ক্রিপ্ট দিস কিওয়ার্ড (JS this Keyword).

Content

জাভাস্ক্রিপ্ট অ্যারো ফাংশন (JS Arrow Function)

Please, contribute to add content into জাভাস্ক্রিপ্ট অ্যারো ফাংশন (JS Arrow Function).

Content

জাভাস্ক্রিপ্ট ক্লাস ( JS Class)

Please, contribute to add content into জাভাস্ক্রিপ্ট ক্লাস ( JS Class).

Content

জাভাস্ক্রিপ্ট মডিউল (JS Module)

Please, contribute to add content into জাভাস্ক্রিপ্ট মডিউল (JS Module).

Content

জাভাস্ক্রিপ্ট জ্যাসন (JS JSON)

ডাটার সংরক্ষন এবং ডাটার আদান-প্রদানের একটি পদ্ধতি হলো জেসন।

সার্ভার থেকে ওয়েবপেজে ডাটা পাঠানোর জন্যও জেসন ব্যবহার করা হয়।

জেসন কি?

জেসন হচ্ছে জাভাস্ক্রিপ্ট অবজেক্ট নোটেশন(JSON - JavaScript Object Notation)
জেসন হচ্ছে ডাটা আদান-প্রদানের একটি সুবিধাজনক পদ্ধতি
জেসন সকল ল্যাংগুয়েজে ব্যবহারযোগ্য*
জেসন স্ব-বর্ণনামূলক এবং এটি বুঝতেও সহজ

*জেসনের গঠনপ্রণালী জাভাস্ক্রিপ্ট অবজেক্ট নোটেশন হতে পাওয়া। যেকোন প্রোগ্রামিং ল্যাংগুয়েজে জেসন ফরমেটে কোড লিখা যায়।

গঠনপ্রণালী

জেসনের গঠনপ্রণালী ব্যবহার করে একটি developer অবজেক্ট তৈরি করা হয়েছেঃ ৩জন ডেভেলপারের বিবরণী(অবজেক্ট) একটি অ্যারেতে রাখা হয়েছেঃ

kt_satt_skill_example_id=642

জাভাস্ক্রিপ্ট অবজেক্ট তৈরির গঠনপ্রণালী এবং জেসনের গঠনপ্রণালী একই।

এই কারণে জেসন ডাটাকে একটি জাভাস্ক্রিপ্ট প্রোগ্রাম খুব সহজেই একটি জাভাস্ক্রিপ্ট অবজেক্টে রুপান্তর করতে পারে।

JSON গঠনের নিয়ম

ডাটা name/value আকারে থাকে
ডাটাকে কমার(,) মাধ্যমে পৃথক করা হয়
দ্বিতীয় বন্ধনীর ভিতরে অবজেক্ট রাখা হয়
তৃতীয় বন্ধনীর ভিতরে অ্যারে রাখা হয়

জেসন ডাটা

জাভাস্ক্রিপ্ট অবজেক্ট প্রোপার্টির মত জেসন ডাটা name/value এর জোড়া আকারে লিখা হয়।

kt_satt_skill_example_id=644

জেসনের নাম লিখতে ডাবল কোটেশন("") দেওয়া বাধ্যতামূলক।

জেসন অবজেক্ট

জেসন অবজেক্ট দ্বিতীয় বন্ধনীর ভিতরে লেখা হয়। জাভাস্ক্রিপ্ট অবজেক্টের মত জেসন অবজেক্টেও একাধিক name/value এর জোড়া থাকতে পারেঃ

kt_satt_skill_example_id=646

জেসন অ্যারে

জেসন অ্যারে তৃতীয় বন্ধনীর মাধ্যমে লিখা হয়। জাভস্ক্রিপ্টের মত জেসন অ্যারেও অবজেক্ট ধারণ করতে পারেঃ

kt_satt_skill_example_id=647

জেসন টেক্সটকে জাভাস্ক্রিপ্ট অবজেক্টে রূপান্তর

ওয়েব সার্ভার থেকে ডাটা ওয়েব পেজে দেখানোর জন্য জেসন ব্যবহার করা হয়।

প্রথমে জেসন ডাটাকে জাভাস্ক্রিপ্ট স্ট্রিংয়ের মধ্যে রাখতে হবে,তারপর ঐ স্ট্রিংকে জাভাস্ক্রিপ্ট অবজেক্টে রুপান্তর করতে জাভাস্ক্রিপ্টের JSON.parse() ফাংশনটি ব্যবহার করুনঃ

kt_satt_skill_example_id=649

তারপর নতুন জাভাস্ক্রিপ্ট অবজেক্ট ব্যবহার করুনঃ

kt_satt_skill_example_id=652

Content added || updated By

Ibnul Haisan

জাভাস্ক্রিপ্ট জাভাস্ক্রিপ্ট ডিবাগিং (JS Debugging)

Please, contribute to add content into জাভাস্ক্রিপ্ট জাভাস্ক্রিপ্ট ডিবাগিং (JS Debugging).

Content

জাভাস্ক্রিপ্ট স্টাইল গাইড (JS Style Guide)

Please, contribute to add content into জাভাস্ক্রিপ্ট স্টাইল গাইড (JS Style Guide).

Content

জাভাস্ক্রিপ্ট বেস্ট প্র্যাকটিস (JS Best Practices)

Please, contribute to add content into জাভাস্ক্রিপ্ট বেস্ট প্র্যাকটিস (JS Best Practices).

Content

জাভাস্ক্রিপ্ট সাধারণ ভুল (JS Common Mistake)

Please, contribute to add content into জাভাস্ক্রিপ্ট সাধারণ ভুল (JS Common Mistake).

Content

জাভাস্ক্রিপ্ট পারফরম্যান্স (JS Performance)

Please, contribute to add content into জাভাস্ক্রিপ্ট পারফরম্যান্স (JS Performance).

Content

জাভাস্ক্রিপ্ট সংরক্ষিত শব্দ ( JS Reserved Words)

Please, contribute to add content into জাভাস্ক্রিপ্ট সংরক্ষিত শব্দ ( JS Reserved Words).

Content

আরও দেখুন...

জাভাস্ক্রিপ্ট ব্যাসিক (JS Basic Tutorial)

জাভাস্ক্রিপ্ট কি এবং কেন শিখবেন? (What is JS & why learn?)

জাভাস্ক্রিপ্ট কি?

জাভাস্ক্রিপ্ট কেন শিখবেন?

জাভাস্ক্রিপ্ট এইচটিএমএল কন্টেন্ট পরিবর্তন করতে পারে

জাভাস্ক্রিপ্ট এইচটিএমএল এট্রিবিউট পরিবর্তন করতে পারে

জাভাস্ক্রিপ্ট এইচটিএমএল স্টাইল পরিবর্তন করতে পারে

জাভাস্ক্রিপ্ট কোথায় রাখবেন?

<script> ট্যাগ

জাভাস্ক্রিপ্ট ফাংশন এবং ইভেন্ট

<head> অথবা <body> এর মধ্যে জাভাস্ক্রিপ্ট

<head>এলিমেন্টে জাভাস্ক্রিপ্ট

<body> এর মধ্যে জাভাস্ক্রিপ্ট

বাহ্যিক জাভাস্ক্রিপ্ট

এক্সটার্নাল জাভাস্ক্রিপ্টের সুবিধা

জাভাস্ক্রিপ্ট টিউটোরিয়াল লিস্ট

জেএস ব্যাসিক টিউটোরিয়াল

কন্ট্রোল স্টেটমেন্ট টিউটোরিয়াল

স্ট্রিং এবং অ্যারে টিউটোরিয়াল

সংখ্যা, গণিত ও তারিখ টিউটোরিয়াল

জেএস ফাংশন-Function টিউটোরিয়াল

জেএস অবজেক্ট-Object টিউটোরিয়াল

জেএস ফর্ম-Form টিউটোরিয়াল

জেএস এইচটিএমএল ডোম-DOM টিউটোরিয়াল

জেএস ব্রাউজার বোম-BOM টিউটোরিয়াল

জেএস রেফারেন্স টিউটোরিয়াল

জাভাস্ক্রিপ্ট আউটপুট (JS Output)

জাভাস্ক্রিপ্ট প্রদর্শনের পদ্ধতি

window.alert() ব্যবহার

document.write() ব্যবহার

innerHTML ব্যবহার

console.log() ব্যবহার

জাভাস্ক্রিপ্ট গঠনপ্রণালী (JS Syntax)

জাভাস্ক্রিপ্ট প্রোগ্রাম

জাভাস্ক্রিপ্ট ভ্যালু

জাভাস্ক্রিপ্ট লিটারাল

জাভাস্ক্রিপ্ট ভ্যারিয়েবল

জাভাস্ক্রিপ্ট অপারেটর

জাভাস্ক্রিপ্ট এক্সপ্রেশন

জাভাস্ক্রিপ্ট কিওয়ার্ড

জাভাস্ক্রিপ্ট কমেন্ট

জাভাস্ক্রিপ্ট আইডেন্টিফায়ার

জাভাস্ক্রিপ্ট কেস সেনসিটিভ

জাভাস্ক্রিপ্ট ক্যামেল কেস

জাভাস্ক্রিপ্ট ক্যারেক্টার সেট

জাভাস্ক্রিপ্ট স্টেটমেন্ট (JS Statement)

জাভাস্ক্রিপ্ট স্টেটমেন্ট

জাভাস্ক্রিপ্ট প্রোগ্রাম

সেমিকোলন (;)

জাভাস্ক্রিপ্ট স্পেস

জাভাস্ক্রিপ্ট লাইনের দৈর্ঘ্য এবং লাইনের বিরতি

জাভাস্ক্রিপ্ট কোড ব্লক

জাভাস্ক্রিপ্ট কিওয়ার্ড

জাভাস্ক্রিপ্ট মন্তব্য (JS Comment)

এক লাইনের কমেন্ট

একের অধিক লাইনের কমেন্ট

কমেন্টের মাধ্যমে কোড সম্পাদনে বাধা দেওয়া

জাভাস্ক্রিপ্ট ডাটা টাইপ (JS Data Type)

জাভাস্ক্রিপ্ট তথ্যের ধরন(Data Type)

ডাটা টাইপের ধারনা

জাভাস্ক্রিপ্ট ডায়নামিক ডাটা টাইপ

জাভাস্ক্রিপ্ট স্ট্রিং(String)

জাভাস্ক্রিপ্ট সংখ্যা

জাভাস্ক্রিপ্ট বুলিয়ান(Boolean)

জাভাস্ক্রিপ্ট অ্যারে(Array)

জাভাস্ক্রিপ্ট অবজেক্ট(Object)

typeof অপারেটর

অসংজ্ঞায়িত(Undefined)

খালি মান(Empty Values)

ফাকা(Null)

Undefined এবং Null এর মধ্যে পার্থক্য

জাভাস্ক্রিপ্ট চলক (JS Variable)

জাভাস্ক্রিপ্ট ভ্যারিয়েবল

ভ্যারিয়েবল প্রায় বীজগণিতের মতই

জাভাস্ক্রিপ্ট আইডেন্টিফায়ার

এসাইনমেন্ট অপারেটর

জাভাস্ক্রিপ্ট ডাটাটাইপ

জাভাস্ক্রিপ্ট ভ্যারিয়েবল তৈরি

একটি স্টেটমেন্টে অনেক ভ্যারিয়েবল

Value = undefined